Question

所以我有一个contenteditable article代码

<article id="content" contenteditable="true">
   <p class="default-text"> Write here </p>
</article>

我有这个jquery在点击文章时删除了p个.default-text标记。

$(document).on('click', '#content', function() {
   $('.default-text').remove();
});
//Here i want to wrap a new <p> </p> as the user starts typing.

基本上，我试图通过删除默认文本来复制输入字段上的占位符文本效果。我还希望文章标签中写的内容包含在p标签周围。我该怎么做？感谢。

Answer 1

这应该有用。

$(document).on('click keyup', '#content', function() {
   if($('.default-text').remove()) {
       if(this.children().length === 0 {
            document.execCommand('formatBlock', false, 'p');
       }
   }
});

Answer 2

这可以解决你的问题...............

<强> HTML

<article id="content">
   <p class="default-text" contenteditable="true"> Write here </p>
</article>

<强> JS

$(document).on('click', '.default-text', function() {
   $('.default-text').text('');
    $(this).removeClass('default-text');
});

输出符合您的要求。

在contenteditable div中的游标周围包装标签

2 个答案: