标签： javascript html nicedit
我是新手程序员，因此无法正常工作。
我有一个Javascript，可在单击按钮时将 </code>标记的内容滚动到底部，但是当我在其中添加NicEdit插件时，该脚本将不起作用。</p> <p>我已经尝试了通过创建外部div和包装器使其工作的所有其他方法，但是我敢肯定，这是NicEdit的原因。</p> <p>没有NicEdit的工作脚本：<a href="http://jsfiddle.net/gab4qhc1" rel="nofollow noreferrer"> http://jsfiddle.net/gab4qhc1 </a> </p> <p> NicEdit无法使用脚本：<a href="http://jsfiddle.net/sgdLzjau" rel="nofollow noreferrer"> http://jsfiddle.net/sgdLzjau </a> </p> <p>请帮助我让脚本与nicedit一起使用。</p> <p>谢谢</p> </div> <div class="answer-list"> <h4>1 个答案:</h4> <div class="hr-line-dashed"></div> <p>答案 0 :(得分：1)</p> <div class="answer markdown-body"> <p>首先，我建议您使用<code>CKEditor</code>或<code>TinyMCE</code>，因为<code>nicEdit</code>不在活跃开发中（<a href="http://nicedit.com/docs.php" rel="nofollow noreferrer">http://nicedit.com/docs.php</a>）。</p> <p>让我们开始解决这个问题，控制台<code>bkLib.domLoad[i] is not a function</code>中有一个错误（我不知道<code>bkLib</code>是什么），所以我要做的是，删除了该函数并删除了JS代码</> <pre><code>nicEditors.allTextAreas({buttonList : ['fontSize','bold','italic','underline','strikeThrough','subscript','superscript']}); </code></pre> <p>从HTML文件中添加到脚本文件中（如果可能，我认为最好将JS和HTML代码分开）</p> <p> <strong> HTML </strong> </p> <pre><code><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> </code></pre> <p> <strong>脚本</strong> </p> <pre><code>$(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() ); }); }); </code></pre> <p>（无需修改CSS）</p> <p> <strong>为什么<code>#textarea</code>选择器不起作用而<code>.nicEdit-main</code>起作用</strong> </p> <p>因此，其背后的原因是每个基于HTML的文本编辑器都使用自己的包装程序，而不是<code>textarea</code>来使它更具可定制性，例如应用<code>bold</code>，<code>italic</code>效果和{{ 1}}他们使用<code>nicEdit</code>类<code>div</code>。</p> <p>我希望这会帮助您解决问题。快乐编码... :) </p> </div> </div> </div> <div class="right"> <div style="height:400px"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6263610230477973" data-ad-slot="2820756182" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div style="height:20px"></div> <div class="releated-question-wrapper"> <div class="header"> 相关问题 </div> <div class="hr-line-dashed"></div> <ul> <li> <a href="/q/10991426">如何使Nicedit只影响页面上的一个textarea而不是页面上的每个textarea</a> </li> <li> <a href="/q/15334557">javascript动态textarea和nicedit</a> </li> <li> <a href="/q/19535372">如何使用addclass和removeclass方法更改textarea的css类（在NicEdit中使用的textarea）</a> </li> <li> <a href="/q/23955272">编辑文本区域中的选定文本并将其打印回textarea</a> </li> <li> <a href="/q/24298837">nicEdit textarea名称来做检查</a> </li> <li> <a href="/q/29560727">使用nicedit textarea值不使用php保存到数据库中</a> </li> <li> <a href="/q/35697081">Ajax数据到nicedit textarea</a> </li> <li> <a href="/q/45710004">在nicedit textarea中粘贴时，标签会被删除</a> </li> <li> <a href="/q/47305866">如何添加NicEdit textarea滚动条？</a> </li> <li> <a href="/q/54033237">JavaScript在使用NicEdit时无法滚动<textarea>上下文</a> </li> </ul> </div> <div class="releated-question-wrapper"> <div class="header"> 最新问题 </div> <div class="hr-line-dashed"></div> <ul> <li> <a href="/q/68614764">我写了这段代码，但我无法理解我的错误</a> </li> <li> <a href="/q/68614678">我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？</a> </li> <li> <a href="/q/68614175">是否有可能使 loadstring 不可能等于打印？卢阿</a> </li> <li> <a href="/q/68614313">java中的random.expovariate()</a> </li> <li> <a href="/q/68614125">Appscript 通过会议在 Google 日历中发送电子邮件和创建活动</a> </li> <li> <a href="/q/68615109">为什么我的 Onclick 箭头功能在 React 中不起作用？</a> </li> <li> <a href="/q/68615123">在此代码中是否有使用“this”的替代方法？</a> </li> <li> <a href="/q/68614097">在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化</a> </li> <li> <a href="/q/68614427">每千个数字得到</a> </li> <li> <a href="/q/68615239">更新了城市边界 KML 文件的来源？</a> </li> </ul> </div> <div class=""> </div> </div> </div> <div> <script> var host = window.location.host; if (host == "www.thinbug.com") { (function () { var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); } </script> </body> </html>
</code>标记的内容滚动到底部，但是当我在其中添加NicEdit插件时，该脚本将不起作用。</p> <p>我已经尝试了通过创建外部div和包装器使其工作的所有其他方法，但是我敢肯定，这是NicEdit的原因。</p> <p>没有NicEdit的工作脚本：<a href="http://jsfiddle.net/gab4qhc1" rel="nofollow noreferrer"> http://jsfiddle.net/gab4qhc1 </a> </p> <p> NicEdit无法使用脚本：<a href="http://jsfiddle.net/sgdLzjau" rel="nofollow noreferrer"> http://jsfiddle.net/sgdLzjau </a> </p> <p>请帮助我让脚本与nicedit一起使用。</p> <p>谢谢</p> </div> <div class="answer-list"> <h4>1 个答案:</h4> <div class="hr-line-dashed"></div> <p>答案 0 :(得分：1)</p> <div class="answer markdown-body"> <p>首先，我建议您使用<code>CKEditor</code>或<code>TinyMCE</code>，因为<code>nicEdit</code>不在活跃开发中（<a href="http://nicedit.com/docs.php" rel="nofollow noreferrer">http://nicedit.com/docs.php</a>）。</p> <p>让我们开始解决这个问题，控制台<code>bkLib.domLoad[i] is not a function</code>中有一个错误（我不知道<code>bkLib</code>是什么），所以我要做的是，删除了该函数并删除了JS代码</> <pre><code>nicEditors.allTextAreas({buttonList : ['fontSize','bold','italic','underline','strikeThrough','subscript','superscript']}); </code></pre> <p>从HTML文件中添加到脚本文件中（如果可能，我认为最好将JS和HTML代码分开）</p> <p> <strong> HTML </strong> </p> <pre><code><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> </code></pre> <p> <strong>脚本</strong> </p> <pre><code>$(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() ); }); }); </code></pre> <p>（无需修改CSS）</p> <p> <strong>为什么<code>#textarea</code>选择器不起作用而<code>.nicEdit-main</code>起作用</strong> </p> <p>因此，其背后的原因是每个基于HTML的文本编辑器都使用自己的包装程序，而不是<code>textarea</code>来使它更具可定制性，例如应用<code>bold</code>，<code>italic</code>效果和{{ 1}}他们使用<code>nicEdit</code>类<code>div</code>。</p> <p>我希望这会帮助您解决问题。快乐编码... :) </p> </div> </div> </div> <div class="right"> <div style="height:400px"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6263610230477973" data-ad-slot="2820756182" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div style="height:20px"></div> <div class="releated-question-wrapper"> <div class="header"> 相关问题 </div> <div class="hr-line-dashed"></div> <ul> <li> <a href="/q/10991426">如何使Nicedit只影响页面上的一个textarea而不是页面上的每个textarea</a> </li> <li> <a href="/q/15334557">javascript动态textarea和nicedit</a> </li> <li> <a href="/q/19535372">如何使用addclass和removeclass方法更改textarea的css类（在NicEdit中使用的textarea）</a> </li> <li> <a href="/q/23955272">编辑文本区域中的选定文本并将其打印回textarea</a> </li> <li> <a href="/q/24298837">nicEdit textarea名称来做检查</a> </li> <li> <a href="/q/29560727">使用nicedit textarea值不使用php保存到数据库中</a> </li> <li> <a href="/q/35697081">Ajax数据到nicedit textarea</a> </li> <li> <a href="/q/45710004">在nicedit textarea中粘贴时，标签会被删除</a> </li> <li> <a href="/q/47305866">如何添加NicEdit textarea滚动条？</a> </li> <li> <a href="/q/54033237">JavaScript在使用NicEdit时无法滚动<textarea>上下文</a> </li> </ul> </div> <div class="releated-question-wrapper"> <div class="header"> 最新问题 </div> <div class="hr-line-dashed"></div> <ul> <li> <a href="/q/68614764">我写了这段代码，但我无法理解我的错误</a> </li> <li> <a href="/q/68614678">我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？</a> </li> <li> <a href="/q/68614175">是否有可能使 loadstring 不可能等于打印？卢阿</a> </li> <li> <a href="/q/68614313">java中的random.expovariate()</a> </li> <li> <a href="/q/68614125">Appscript 通过会议在 Google 日历中发送电子邮件和创建活动</a> </li> <li> <a href="/q/68615109">为什么我的 Onclick 箭头功能在 React 中不起作用？</a> </li> <li> <a href="/q/68615123">在此代码中是否有使用“this”的替代方法？</a> </li> <li> <a href="/q/68614097">在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化</a> </li> <li> <a href="/q/68614427">每千个数字得到</a> </li> <li> <a href="/q/68615239">更新了城市边界 KML 文件的来源？</a> </li> </ul> </div> <div class=""> </div> </div> </div> <div> <script> var host = window.location.host; if (host == "www.thinbug.com") { (function () { var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); } </script> </body> </html>