如何使 jQuery 文本编辑器中的链接可点击？答案

【问题标题】：How to make links inside jQuery Text Editor clickable?如何使 jQuery 文本编辑器中的链接可点击？
【发布时间】：2013-12-18 19:02:50
【问题描述】：

在我的 jquery 编辑器中动态添加引导弹出框时，我发现编辑器内的任何链接都呈现为不可点击。我在弹出框的内容中放置了超链接，并且这些链接也呈现为不可点击。知道如何在编辑器中覆盖此效果以使它们可点击。谢谢你。

HTML

<textarea class="textarea"></textarea>

飞镖

  context.callMethod(r'$', ['.textarea']).callMethod('jqte');
  querySelector('.jqte_editor').children.add(new AnchorElement(href: 'dartlang.org')..text = 'link');

【问题讨论】：

请出示您的代码。
我添加了示例代码。谢谢。
链接不能在内点击；它是明文。 <a href="/default/index/tourl?u=aHR0cDovL3N0YWNrb3ZlcmZsb3cuY29tL3F1ZXN0aW9ucy84Nzk4Mzk0L3R1cm4tZWFjaC1saW5lLW9mLXRleHRhcmVhLWludG8tYS1saW5r" title="turn each line of textarea into a link" target="_blank" rel="nofollow">stackoverflow.com/questions/8798394/…</a>
我将其更改为 div，但没有帮助。但是，我发现在 jqte 中呈现链接不可点击的属性：contenteditable="true"。将此更改为 false 会使链接可点击，但会破坏编辑器修改文本的目的。 :(
我认为可能的解决方案是在链接中添加一个 onHover 属性来禁用 contenteditable。 :)

标签： jquery twitter-bootstrap bootjack

【解决方案1】：

也许有另一种解决方案，但这里有一个。 jqte 中的链接不可点击，因为 jqte 将其 contenteditable 属性设置为 true。

  querySelector('.jqte_editor').children.add(new AnchorElement(href: 'dartlang.org')
  ..text = 'link'
  ..onMouseOver.listen((e){
    querySelector('.jqte_editor').setAttribute('contenteditable', 'false');
  })
  );

基本上，我已将 onMouseOver 侦听器添加到将 jqte 编辑器的 contentediable 属性更改为 false 的锚元素。

【讨论】：