javascript - 占位符在 NicEdit 中不起作用

Question

我正在使用 NicEdit Inline WYSIWYG 并尝试了解如何使用占位符。

我创建了一个带有属性占位符的 div，但是当 NicEdit 激活它时，显示没有占位符的空白文本区域。

也许有一些方法可以让它发挥作用。据我了解，它将文本直接写入 div。

在代码中它看起来像。 (我评论 display non for textarea) http://i.imgur.com/D384B5C.png

Answer 1

您可以使用 nicEditor 事件手动添加/删除占位符。
focus当编辑器获得焦点时发送(即有人在其中单击)。
blur当编辑器实例失去焦点时发送。

var editor = new nicEditor();
var $placeholder = '<p>Click here to add content...</p>';

$('[id^="textArea"]').each(function() {
    var textAreaId =  $(this).attr("id");

    editor.addInstance( textAreaId );
    var editorInstance = editor.instanceById(textAreaId)

    // Add the initial Placeholder
    var content = editorInstance.getContent();
    if(content == "" || content == "<br>"){
        editor.instanceById(textAreaId).setContent($placeholder);
    }

    // onFocus - Remove the placeholder
    editor.addEvent('focus', function() 
    {
        if (editorInstance.getContent() == $placeholder){
            editor.instanceById(textAreaId).setContent("<br>");
        }
    });

    // onBlur - Re-add the placeholder
    editor.addEvent('blur', function() 
    {
        var newText = editorInstance.getContent();
        if(newText == "" || newText == "<br>") {
            editor.instanceById(textAreaId).setContent($placeholder);
        }
    });
});

首先，检查是否没有内容或是否有单个 <br> (这是 nicEditor 的占位符)。如果是这样，请替换为您的占位符。
然后在焦点上检查占位符并将内容更改回 "<br>" .
然后在模糊检查内容是否仍然为空并再次用占位符替换它