首页 > web前端 > js教程 > jquery实现在光标位置插入内容的方法_jquery

jquery实现在光标位置插入内容的方法_jquery

WBOY
发布: 2016-05-16 16:15:28
原创
1264 人浏览过

本文实例讲述了jquery实现在光标位置插入内容的方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:
 
 
<头> 
    无标题页标题> 
    <脚本类型=“text/javascript”src=“jquery-1.7.2.min。js”> 
     
        (函数($){ 
            $.fn.extend({ 
                insertAtCaret: 函数 (myValue) { 
                    var $t = $(this)[0]; 
                    if (文档.选择) { 
                        this.focus(); 
                        sel = document.selection.createRange(); 
                        sel.text = myValue; 
                        this.focus(); 
                    } 其他 
                        if ($t.selectionStart || $t.selectionStart == '0')
   { 
                            var startPos = $t.selectionStart; 
                            var endPos = $t.selectionEnd; 
                            varscrollTop = $t.scrollTop; 
                            $t.value = $t.value.substring(0, startPos) myValue $t.value.substring(endPos,$t.value.length); 
                            this.focus(); 
                            $t.selectionStart = startPos myValue.length;
                            $t.selectionEnd = startPos myValue.length; 
                            $t.scrollTop = 滚动顶部; 
                        } 其他 { 
                            this.value = myValue; 
                            this.focus(); 
                        } 
                } 
            }) 
        })(jQuery); 
        $(文档).ready(function () { 
            $("#numd").bind("mouseleave", function () { 
                document.getElementById('keybored').style.display = 'none'; 
                document.getElementById('Nm').blur(); 
            }); 
            $("#Nm").focus(function () { 
                document.getElementById('keybored').style.display = ''; 
            }); 
            $(".readbtns").click(function () { 
                $("#Nm").insertAtCaret($(this).val()); 
            }); 
        }); 
     
 
 
   
     
           
  •  
                 
               
     
               
     
           
  •  
       
 
   
     
        <输入类型=“文本”id=“Nm”名称=“Nm”值=“”/>/> 
       
            id="keybored"> 
            <输入类型=“按钮”类=“readbtns”值=“1”/> 
            <输入类型=“按钮”类=“readbtns”值=“2”/> 
            <输入类型=“按钮”类=“readbtns”值=“3”/> 
            <输入类型=“按钮”类=“readbtns”值=“4”/> 
            <输入类型=“按钮”类=“readbtns”值=“5”/> 
            <输入类型=“按钮”类=“readbtns”值=“6”/> 
            <输入类型=“按钮”类=“readbtns”值=“7”/> 
            <输入类型=“按钮”类=“readbtns”值=“8”/> 
            <输入类型=“按钮”类=“readbtns”值=“9”/> 
       
 
   
 
 

希望本文对大家的 jQuery 程序设计有所帮助。

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板