ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryはカーソル位置にコンテンツを挿入するメソッドを実装します_jquery

jqueryはカーソル位置にコンテンツを挿入するメソッドを実装します_jquery

WBOY
WBOYオリジナル
2016-05-16 16:15:281212ブラウズ

この記事の例では、jquery がカーソル位置にコンテンツを挿入する方法を説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。

コードをコピー コードは次のとおりです:
 
 
 
    無标题页 
     
    <スクリプトタイプ="text/javascript"> 
        (関数 ($) {
            $.fn.extend({
                insertAtCaret: function (myValue) {
                    var $t = $(this)[0]; 
                    if (document.selection) {
                        this.focus(); 
                        sel = document.selection.createRange(); 
                        sel.text = myValue; 
                        this.focus(); 
                    } else
                        if ($t.selectionStart || $t.selectionStart == '0')
   {
                            var startPos = $t.selectionStart; 
                            var endPos = $t.selectionEnd; 
                            var スクロールトップ = $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 = スクロールトップ; 
                        } else {
                            this.value = myValue; 
                            this.focus(); 
                        }
                }
            })
        })(jQuery); 
        $(document).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="キーボード"> 
             
             
             
             
             
             
             
             
             
       
 
   
 
 

ここで説明されている大規模な jQuery プログラムの設計が役立つことを望みます。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。