zoukankan      html  css  js  c++  java
  • input、textarea、div(contenteditable=true)光标定位到最后

    1、针对input、textarea

    //定位input、textarea
            function po_Last(obj) {
                obj.focus();//解决ff不获取焦点无法定位问题
                if (window.getSelection) {//ie11 10 9 ff safari
                    var max_Len=obj.value.length;//text字符数
                    obj.setSelectionRange(max_Len, max_Len);
                }
                else if (document.selection) {//ie10 9 8 7 6 5
                    var range = obj.createTextRange();//创建range
                    range.collapse(false);//光标移至最后
                    range.select();//避免产生空格
                }
            }
    

     

    2、针对div(contenteditable="true")

    //定位div(contenteditable = "true")
            function po_Last_Div(obj) {
                if (window.getSelection) {//ie11 10 9 ff safari
                    obj.focus(); //解决ff不获取焦点无法定位问题
                    var range = window.getSelection();//创建range
                    range.selectAllChildren(obj);//range 选择obj下所有子内容
                    range.collapseToEnd();//光标移至最后
                }
                else if (document.selection) {//ie10 9 8 7 6 5
                    var range = document.selection.createRange();//创建选择对象
                    //var range = document.body.createTextRange();
                    range.moveToElementText(obj);//range定位到obj
                    range.collapse(false);//光标移至最后
                    range.select();
                }
            }
    

      

        <!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>div contenteditable光标测试</title>  
        <style type="text/css">  
            .div{ 600px; height:200px; border:1px solid #CCC}  
        </style>  
        <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>  
        <script type="text/javascript">  
            $(document).ready(function(e) {  
                $('.aclick').click(function(){  
                    $('.div').html("回复[潇sdfsdfssssssssssssssdfsdf潇]:");  
                    $('.div').focus(); 
                    po_Last_Div($('.div').get(0)); 
                })  
            });  
            
    
            function po_Last_Div(obj) {
                if (window.getSelection) {//ie11 10 9 ff safari
                    obj.focus(); //解决ff不获取焦点无法定位问题
                    var range = window.getSelection();//创建range
                    range.selectAllChildren(obj);//range 选择obj下所有子内容
                    range.collapseToEnd();//光标移至最后
                }
                else if (document.selection) {//ie10 9 8 7 6 5
                    var range = document.selection.createRange();//创建选择对象
                    //var range = document.body.createTextRange();
                    range.moveToElementText(obj);//range定位到obj
                    range.collapse(false);//光标移至最后
                    range.select();
                }
            }
        </script>  
        </head>  
          
        <body>  
    	<input type="text">
            <div  class="aclick">回复潇潇</div>  
            <div class="div" contenteditable="true">  
            </div>  
        </body>  
        </html>  
    

      

  • 相关阅读:
    【文献阅读】Stack What-Where Auto-encoders -ICLR-2016
    【文献阅读】Augmenting Supervised Neural Networks with Unsupervised Objectives-ICML-2016
    ubuntu14.04设置sublime text3为默认文本编辑器
    【TensorFlow-windows】(六) CNN之Alex-net的测试
    【TensorFlow-windows】(七) CNN之VGG-net的测试
    Vue知识整理7:vue中函数的应用
    Vue知识整理6:JavaScript表达式
    Vue知识整理5:v-bind绑定属性(Class 与 Style 绑定)
    Vue知识整理4:v-html标签
    Vue知识整理3:v-once的使用
  • 原文地址:https://www.cnblogs.com/ghfjj/p/8603295.html
Copyright © 2011-2022 走看看