contenteditable 编辑框光标跳到数字或英文开头问题解决方法
当使用 contenteditable 属性编辑单元格时,光标在数字或英文输入时会跳到最前面,而中文则正常,这是因为数字和英文的文本内容被解释为右对齐,因此光标在最前面。
您可以尝试通过设置 CSS 样式来解决该问题:
td[contenteditable='true'] {
text-align: left; /* 或者使用 'center' 或 'right' 根据您的需求 */
}
如果这不起作用,您可能需要使用 JavaScript 来设置光标位置。您可以使用以下代码:
function moveCursorToEnd(el) {
el.focus();
if (typeof window.getSelection != 'undefined' && typeof document.createRange != 'undefined') {
var range = document.createRange();
range.selectNodeContents(el);
range.collapse(false);
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
} else if (typeof document.body.createTextRange != 'undefined') {
var textRange = document.body.createTextRange();
textRange.moveToElementText(el);
textRange.collapse(false);
textRange.select();
}
}
// 在编辑内容时调用该函数
function editGoods(gid, field, value) {
// ...
var td = event.target;
moveCursorToEnd(td);
// ...
}
这个 moveCursorToEnd 函数将光标移动到元素的末尾,然后您可以在编辑函数中调用它,以确保光标在正确的位置。
原文地址: https://www.cveoy.top/t/topic/mEFk 著作权归作者所有。请勿转载和采集!