javascript 如何使 Nicedit 只影响页面上的一个文本区域,而不影响页面上的每个文本区域

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10991426/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 11:45:15  来源:igfitidea点击:

How to make Nicedit only affect one textarea on a page as oposed to every textarea on the page

javascripttextareanicedit

提问by user1373823

I've been trying to use nicedit (http://nicedit.com/) on a form for my website (which I am using to submit short stories). The form includes several textareas (). One of them is for the content of the short story, which i want to use nicedit on. The other text area is for tags, which i do not want to use nicedit on. However, nicedit gets applied to both.

我一直在尝试在我的网站(我用来提交短篇小说)的表单上使用 nicedit (http://nicedit.com/)。该表单包括几个textarea()。其中之一是短篇小说的内容,我想在上面使用 nicedit。另一个文本区域用于标记,我不想在其上使用 nicedit。但是,nicedit 对两者都适用。

This is the javascript code i am using to call up the nicedit code

这是我用来调用 nicedit 代码的 javascript 代码

<script type="text/javascript" src="core/rte.js"></script> <script type="text/javascript">
//<![CDATA[
bkLib.onDomLoaded(function() { nicEditors.allTextAreas() });
//]]>

I checked in the nicEdit.js and the allTextAreas() corresponds to this:

我检查了 nicEdit.js 和 allTextAreas() 对应于这个:

allTextAreas : function(nicOptions) {
var textareas = document.getElementsByTagName("textarea");
for(var i=0;i<textareas.length;i++) {
nicEditors.editors.push(new nicEditor(nicOptions).panelInstance(textareas[i]));
}
return nicEditors.editors;
},

I also investigated on the ingetnet and could find no answer as to how to make only one text area be affected by the nicedit code. Can anyone help?

我还在 ingetnet 上进行了调查,但没有找到有关如何使 nicedit 代码仅影响一个文本区域的答案。任何人都可以帮忙吗?

回答by Nathan Wall

From looking at the code you posted, this should work:

从查看您发布的代码来看,这应该有效:

<script type="text/javascript" src="core/rte.js"></script>
<script type="text/javascript">
//<![CDATA[
bkLib.onDomLoaded(function() {
    nicEditors.editors.push(
        new nicEditor().panelInstance(
            document.getElementById('myNicEditor')
        )
    );
});
//]]>
</script>

Just give your textarea whichever id you use:

只需给你的 textarea 你使用的任何 id:

<textarea id="myNicEditor"></textarea>

回答by jarimos

I made it for all textareas by tagname using the original function as start point

我使用原始函数作为起点通过标记名为所有文本区域制作了它

<script type="text/javascript">

bkLib.onDomLoaded(function () {

    var textareas = document.getElementsByTagName("textarea");

    for(var i=0;i<textareas.length;i++)
     {
        var myNicEditor = new nicEditor();
        myNicEditor.panelInstance(textareas[i]);

     }
});

回答by 6ft Dan

For anyone who's looking to do this with multiple textarea's by class name I'm using Nathan Wall's examplewith a few changes:

对于任何希望通过类名使用多个 textarea 执行此操作的人,我使用Nathan Wall 的示例进行了一些更改:

<script type="text/javascript">
  //<![CDATA[
  bkLib.onDomLoaded(function() {
    elementArray = document.getElementsByClassName("nice-edit");
    for (var i = 0; i < elementArray.length; ++i) {
      nicEditors.editors.push(
        new nicEditor().panelInstance(
          elementArray[i]
        )
      );
    }
  });
  //]]>
</script>

Use as many text areas as you'd like with the class name nice-edit:

在类名中使用任意数量的文本区域nice-edit

<textarea class="nice-edit"></textarea>

In Rails I use CoffeeScript and this is my modified code:

在 Rails 中,我使用 CoffeeScript,这是我修改后的代码:

$ ->
  #<![CDATA[
  elementArray = document.getElementsByClassName("nice-edit")
  i = 0
  while i < elementArray.length
    nicEditors.editors.push new nicEditor(fullPanel: true).panelInstance(elementArray[i])
    ++i
  #]]>

You'll notice I completely removed the bkLib.onDomLoadedline and just called the equivelant of document function do $ ->. The reason is bkLib.onDomLoadedfails to load initially because of turbolinks. It only works with a refresh. Thus why I've removed it.

您会注意到我完全删除了该bkLib.onDomLoaded行,只是调用了文档函数 do 的等效项$ ->。原因是bkLib.onDomLoaded由于turbolinks最初无法加载。它仅适用于刷新。这就是为什么我删除了它。