如果使用按钮,我可以轻松地对内容可编辑的选择执行 execcommand 。但是使用任何其他元素都会失败。
http://jsbin.com/atike/edit http://jsbin.com/atike/edit
为什么会这样以及如何使用 div 元素使其工作。
Thanks.
您可以使用以下命令保存选择mousedown
正在使用的元素而不是按钮上的事件,并在将可编辑元素聚焦在click
event.
我修改了示例代码:http://jsbin.com/atike/40/edit http://jsbin.com/atike/40/edit。这是代码:
function saveSelection() {
if (window.getSelection) {
sel = window.getSelection();
if (sel.getRangeAt && sel.rangeCount) {
var ranges = [];
for (var i = 0, len = sel.rangeCount; i < len; ++i) {
ranges.push(sel.getRangeAt(i));
}
return ranges;
}
} else if (document.selection && document.selection.createRange) {
return document.selection.createRange();
}
return null;
}
function restoreSelection(savedSel) {
if (savedSel) {
if (window.getSelection) {
sel = window.getSelection();
sel.removeAllRanges();
for (var i = 0, len = savedSel.length; i < len; ++i) {
sel.addRange(savedSel[i]);
}
} else if (document.selection && savedSel.select) {
savedSel.select();
}
}
}
$(function() {
var savedSel;
$('.bold').mousedown(function () {
savedSel = saveSelection();
});
$('.bold').click(function () {
$('#hello').focus();
if (savedSel) {
restoreSelection(savedSel);
}
document.execCommand("bold", false, null);
});
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)