web-dev-qa-db-ja.com

変数に格納されるJQUERY入力フィールド値

ユーザーがテキストボックスに入力した値を変数にキャプチャできません。

<form>を使用したくないのですが、他に方法はありますか？

   <html>
   <head>
   <style>

     p { color:blue; margin:8px; }
     </style>
     <script src="http://code.jquery.com/jquery-latest.js"></script>
   </head>
   <body>
   <input type="text" id="txt_name"  />

   <script type="text/javascript">
   value = $("#txt_name").val(); 
   $("#dom_element").text(value);
   </script>

   </body>
   </html>
jqueryinputtextfield
8
user1114409

ユーザーが入力した値を取得したい場合は、何らかのイベントに応答して取得する必要があります。 keyupイベントは、ユーザーが入力してキーを離したときに発生します（信じられないかもしれません）。キーアップをトラップする場合は、キーストロークごとに変数を更新できますが、「変更」もトラップして、キーボードを使用しない貼り付けやドラッグアンドドロップの変更を可能にする必要があります。 「変更」イベントは、ユーザーがフィールドを変更し、クリックまたはタブで移動したときに発生します。

また、現時点ではvalue変数はグローバルですが、それを使用しているのが別のフィールドの値を設定することである場合は、まったく必要ありません。

_$("#txt_name").on("keyup change", function() {
   $("#dom_element").text(this.value);
});

// OR, if you need the variable for some other reason:
$("#txt_name").on("keyup change", function() {
   var value = this.value; // omit "var" to make it global
   $("#dom_element").text(value);
});
_

イベントハンドラー関数内では、thisがdom要素になるため、jQueryなしで直接その値を取得できることに注意してください。

古いバージョンのjQueryを使用している場合は、.bind()ではなく.on()を使用してください。

11
nnnnnn

あなたはこのような意味ですか？

脚本：

jQuery(function(){
    $("#txt_name").keypress(function() {
      var value = $("#txt_name").val(); 
      $("#myDiv").text(value);
    });
});

HTML：

<form>
  <fieldset>
    <input id="txt_name" type="text" value="Hello World" />
  </fieldset>
</form>
<div id="myDiv"></div>

お役に立てば幸いです。

3
Al-Mothafar
<script>
   $('#txt_name').keyup(function(){
      value = $("#txt_name").val(); 
      $("#dom_element").val(value);
   });
</script>

これは api.jquery.com からのものです：

.text（）メソッドは、フォーム入力またはスクリプトでは使用できません。 input要素またはtextarea要素のテキスト値を設定または取得するには、.val（）メソッドを使用します。スクリプト要素の値を取得するには、.html（）メソッドを使用します。

JQuery 1.4以降、.text（）メソッドは、要素ノードだけでなく、テキストおよびCDATAノードの値を返します。

1
Ashkan Mobayen Khiabani