要存储在变量中的 JQUERY 输入字段值答案

【问题标题】：JQUERY input field value to be stored in a variable要存储在变量中的 JQUERY 输入字段值
【发布时间】：2012-01-27 08:07:53
【问题描述】：

我无法将用户在文本框中输入的值捕获到变量中。

我不想使用<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>

【问题讨论】：

标签： jquery input textfield

【解决方案1】：

你的意思是这样吗？

脚本：

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>

希望对你有帮助。

【讨论】：

使用 keyup 而不是 keypress。这样每次输入时都会出现最后一个字符。

【解决方案2】：

<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 节点以及元素节点的值。

【讨论】：

【解决方案3】：

如果您想获得用户键入的值，那么您需要这样做以响应某种事件。当用户键入并释放键时，会发生 keyup 事件（信不信由你）。如果您捕获 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()。

【讨论】：

我知道这是一个老问题，但我正在使用它（这很好，谢谢），但我注意到它只输入第一个元素，所以你知道我能做什么如果我有两个或多个带有“#dom_element”ID 的 DIV？