我正在使用document.execCommand("unlink", false, false);
删除我自己的html编辑器中的超链接和锚点。它工作正常,除了一种情况:它不会删除Firefox中的锚点。这是不是在Firefox中支持,还是有另一种解决方法?
这是我的例子:
<div contenteditable="true">This is an <a name="anker">anchor</a>. And this is a <a href="#">normal hyperlink</a>. Please try to select them and then press the "Unlink" button.</div>
<input type="button" id="btn" value="Unlink">
$(document).ready(function() {
$('#btn').click(function() {
document.execCommand("unlink", false, false);
});
});
答案 0 :(得分:3)
要回答有关替代方案的问题,您可以在调用a
之前强制解决问题并设置任何href
元素的unlink
属性:
$(document).ready(function() {
var $editable = $('[contenteditable]');
$('#btn').click(function() {
$editable.find('a:not([href])').attr('href', '#');
document.execCommand("unlink", false, false);
});
});
当然,可能有多种方法可以“解决”这个问题。我认为$.unwrap()
可能也会起作用。我不是那么精通document.execCommand
和富文本编辑器,但我想你需要小心,精确和测试测试。
注意,这只是一个示范;你真的要考虑这个问题并考虑你将如何处理这个问题。例如,如果Firefox是浏览器,您可以检测并仅运行它,这将限制您可能遇到的任何意外损坏或结果。
修改强>
这是一个更完整的版本,仅影响所选的文本范围:
$(document).ready(function() {
$('#btn').click(function unlink() {
var holder,
frag,
range,
child;
if (window.getSelection && window.getSelection().getRangeAt) {
holder = document.createElement('div');
frag = document.createDocumentFragment();
range = window.getSelection().getRangeAt(0);
$(holder)
.append(range.cloneContents())
.find('a:not([href])')
.attr('href', '#');
while ((child = holder.firstChild)) {
frag.appendChild(child);
}
range.deleteContents();
range.insertNode(frag);
}
document.execCommand("unlink", false, false);
});
});
在文本范围和选择方面,我不是天才,所以我修改了这个答案中的代码:
https://stackoverflow.com/a/6252893/451969
想出上面的内容。如果有人看到错误或不连贯的内容,请在下面留言。