0

このフィドルで:http://jsfiddle.net/2mw4c/12/

<p>タグからテキストをクリアして、入力を開始できるようにしたいと思います。私が抱えている問題は、クリックすると<p>タグがクリアされ、入力できないことです。

JavaScript:

$("p").on("mousedown", function(e){
    if($(this).text() === "Click"){
        $(this).text("").focus();
    }
});

HTML:

<div class="content" contenteditable="true"><p>Click</p></div>

タグへの書き込みを開始するには、何ができる必要がありますか?

4

4 に答える 4

5

あなたが何を達成しようとしているのか正確にはわかりませんがcontenteditablep要素に移動したときにうまくいきました。

私があなたのコメントから得た印象は、マークアップで現在の構造を維持したいということです。が空っぽdivで崩壊しているようです。pフィドルのリンクを更新しました。

http://jsfiddle.net/nyaray/2UJRS/2/

于 2013-11-06T02:13:31.903 に答える
1

フィドルのデモ

$("p").on("mousedown", function (e) {
    var that = $(this);
    var txt = that.text();
    if (txt === "Click") {
        height = that.css('height');
        that.css('height', height).text("").focus();
    } else if ((txt).length) {
        that.css('height', 'inherit');
    } else if (txt.length === 0) {
        that.css('height', height);
    }
});
于 2013-11-06T02:16:56.003 に答える
1

最小の高さと幅を設定できます。サイズを指定しないと、in がインライン要素であるため、p-tag 内にクリック可能な領域がありません。

http://jsfiddle.net/MrPolywhirl/WZg6H/

div.content>p {
    min-width: 1em;
    min-height: 1em;
    background: #EEF;
}
于 2013-11-06T02:23:40.590 に答える
0

<p>あなたがしようとしているタグは入力として使用されていると思いますので、次の変更を確認してください:

代わりにこれを試してください:

http://jsfiddle.net/2mw4c/22/

于 2013-11-06T02:15:51.833 に答える