JavaScript 使用 NicEdit 时无法滚动 <textarea> 上下文

Question

我是一名编码新手，所以我很难让它工作。

我有一个 javascript 可以在单击按钮时将 <textarea> 标签的内容滚动到底部，但是当我在其中添加 NicEdit 插件时，脚本不起作用。

我已经尝试了所有其他方法来通过创建外部 div 和包装器来使其工作，但我确信这是 NicEdit 的功劳。

没有 NicEdit 的工作脚本：http://jsfiddle.net/gab4qhc1

无法使用 NicEdit 运行脚本：http://jsfiddle.net/sgdLzjau

请帮助我使脚本与 nicedit 一起工作。

谢谢

Answer 1

首先，我建议您使用 CKEditor 或 TinyMCE，因为 nicEdit 未在积极开发中 (http://nicedit.com/docs.php)。

让我们来解决问题，控制台出现错误bkLib.domLoad[i] is not a function（我不知道什么是bkLib）所以我所做的是，我删除了那个函数并删除了JS代码

nicEditors.allTextAreas({buttonList : ['fontSize','bold','italic','underline','strikeThrough','subscript','superscript']});

来自HTML文件并添加到脚本文件中（我认为最好将JS和HTML代码分开，如果可能的话）如下

HTML

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script src="http://js.nicedit.com/nicEdit-latest.js" type="text/javascript"></script>

<textarea id="textarea" cols=30 rows=5 >
    Please presse enter Please presse enterPlease presse enter
    Please presse enterPlease presse enterPlease presse enter
    Please presse enterPlease presseenter
    Please presse enterPlease presse enter
    Please presse enter
</textarea>

<button id="button">click</button>

脚本

$(document).ready(function(){
    nicEditors.allTextAreas({buttonList : ['fontSize','bold','italic','underline','strikeThrough','subscript','superscript']});

    $("#button").click(function(){
        var textArea = $('.nicEdit-main');/*replace #textarea with .nicEdit-main*/
        textArea.scrollTop( textArea[0].scrollHeight - textArea.height()   );
    });  
});

(不需要修改CSS)

为什么 #textarea 选择器不起作用而 .nicEdit-main 起作用

所以，这背后的原因是每个基于 HTML 的文本编辑器都使用自己的包装器而不是 textarea 以使其更可自定义，例如应用 bold、italic 效果，在 nicEdit 中，他们使用 div 和 class nicEdit-main.

希望本文能帮助您解决问题。快乐编码...:)

JavaScript 使用 NicEdit 时无法滚动 <textarea> 上下文

JavaScript unable to scroll <textarea> context while using NicEdit

html

javascript

nicedit