0

我只在 Firefox 中遇到了这个棘手的问题：当我将链接元素添加到 contentEditable 段落时，有时它会在 2 或 3 中破坏该段落。这不会显示任何错误，有时需要几秒钟。这是代码：

function changeSelectedText(type,text) {
  var selObj = window.getSelection();
  var selRange = selObj.getRangeAt(0);
  var newElement = document.createElement(type);
  if(type == "a") {
    newElement.setAttribute('href', text.toLowerCase());
    newElement.setAttribute('target', "_blank");
  } else if(type == "span"){
    newElement.setAttribute('class', "big");
  }
  var documentFragment = selRange.extractContents();
  newElement.appendChild(documentFragment);
  selRange.insertNode(newElement);
  var range = document.createRange();
  range.selectNodeContents(newElement);
  selObj.removeAllRanges();
  selObj.addRange(range);
}

添加 span 效果很好，但使用链接有时会导致这种奇怪的行为。知道为什么吗？

这是迈克建议的 jsfiddle 的链接： jsfiddle 链接

4

1 回答 1

1

找到它:) 问题是我用于添加链接的按钮（jsfiddle 的#link div）有时会被选中（仅 FF）。我认为 mousedown 功能应该防止这种情况发生，但事实并非如此。所以，我所做的是添加了 js 以防止选择该按钮：

 <div id="#link" onselectstart="return false;" ondragstart="return false;">Add Link</div>

如果有人有更好的解决方案，请告诉我；）

于 2013-09-09T07:23:25.723 回答