chrome js控制可编辑DIV光标移动到最后

最新推荐文章于 2023-08-14 11:05:03 发布

liangbinny

最新推荐文章于 2023-08-14 11:05:03 发布

阅读量5.1k

点赞数

分类专栏： Web前端文章标签： w3c

本文链接：https://blog.csdn.net/liangbinny/article/details/41693727

版权

Web前端专栏收录该内容

20 篇文章 0 订阅

订阅专栏

针对可编辑div的光标移动，IE比较容易，但是chrome搜索了半天都没找到有效的方法，好像没很好的支持，最后找了，只找到个移动在最后的方法，代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>测试</title>
</head>
<script type="text/javascript">
function keyAction() {
var textbox = document.getElementById('bodyDiv');
var sel = window.getSelection();
var range = document.createRange();
range.selectNodeContents(textbox);
range.collapse(false);
sel.removeAllRanges();
sel.addRange(range);
}
</script>
<body>
<div id="bodyDiv" contenteditable="true" style="width: 100%; height: 100%;" οnkeyup="keyAction(event);">123456789</div>
</body>
</html>