Jquery问题,点击一个元素,怎么设置光标在另一个元素里的位置?-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

Jquery问题,点击一个元素,怎么设置光标在另一个元素里的位置?

2016-03-23 15:13:37 2384 1

使用Jquery,点击A元素,怎么设置光标到B元素里,并且在最后的位置。(B元素是DIV,有contenteditable="true" 属性)
以下代码,点了A后,光标都是在B元素里最前面。。。

<!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=utf-8" />
<title>测试</title>
<style type="text/css">
.aaa{ height:36px; line-height:36px; width:500px; margin:50px auto 0; border:1px solid #ccc; font-size:18px;background:#f5f5f5;cursor:pointer; }
.bbb{ width:380px; float:left; height:34px; border:1px solid #ccc; background:#fff; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
</head>

<body>


<div class="aaa">
    
    <div class="bbb" contenteditable="true">光标怎么才能在最后</div>
点我
</div>


<script type="text/javascript">
        $(function(){ 
        
            $(".aaa").click(function(){
                $(".bbb").focus();
              })
        })
</script>

</body>
</html>
取消 提交回答
全部回答(1)
  • 小旋风柴进
    2019-07-17 19:11:14
    function placeCaretAtEnd(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() {
        $(".aaa").click(function() {
            placeCaretAtEnd($('.bbb')[0]);
        })
    })​

    另外,建议“点我”不要是div.aaa下的文本节点,因为现在这样 div.aaa>div.bbb,你点击div.bbb时同样触发div.aaa的点击事件(冒泡),光标会直接跳到最后。将事件注册到 span#clickme 上就可以解决了。

    0 0
相关问答

1

回答

jquery ajax中都支持哪些数据类型呀?

2021-11-22 21:54:10 537浏览量 回答数 1

1

回答

jQuery Ajax 常用的方法是什么?

2021-11-07 11:58:35 226浏览量 回答数 1

1

回答

jQuery AJAX的本质是什么?

2021-11-07 10:01:44 189浏览量 回答数 1

1

回答

JQuery 与ajax的关系是什么?

2021-09-29 15:56:15 441浏览量 回答数 1

1

回答

Ajax和jQuery有什么区别?

2021-09-28 16:29:18 329浏览量 回答数 1

1

回答

jQuery中ajax请求数据时候json格式报错 ?报错

2020-06-23 00:36:38 360浏览量 回答数 1

1

回答

jquery ajax的问题。?报错

2020-06-22 19:55:43 267浏览量 回答数 1

1

回答

springmvc+jquery+ajax 报错 Unexpected token <?报错

2020-06-14 17:56:22 392浏览量 回答数 1

1

回答

jquery如何选中下一个元素的第一个子元素

2016-05-30 13:42:11 3427浏览量 回答数 1

1

回答

jquery 怎么将选中的元素逐个遍历?

2016-05-25 10:45:09 1422浏览量 回答数 1
文章
问答
问答排行榜
最热
最新
相关课程
更多
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载