使用 Javascript 实时打印字段输入数据

Printing field input data live with Javascript

本文关键字：输入 数据 字段 打印 Javascript 实时 使用      更新时间：2023-09-26

有一个问题要问你们这些JavaScript大师。我正在创建一个侧边栏工具，该工具由几个不同的文本输入字段组成。此工具的目的是编辑模板上的副本。我尝试将输入的数据传递到字段中更改，但是将数据转储到我的js对象中时遇到了问题。这是我的想法：

$('myInputField').(function(){
      $(this).onChange(){
          // write to variable X
}
});

从本质上讲，我希望实时模仿我在输入中键入的内容，然后我可以解析对数据库的更改。 

$('#myInputField').(function(){
      $(this).onkeyup(){
          x = this.value;
      }
});

或更简洁地说：

$('#myInputField').onkeyup(){
    x = this.value;
});

您只是在查找该事件处理程序中myInputField的值？ 像这样的东西？

$('myInputField').(function(){
  $(this).onChange(){
      x = $(this).val();
  }
});

我不记得this是否已经是一个jQuery对象。 如果是，那么这应该有效，也许可以跳过一点开销：

x = this.val();

此外，您可以使用普通的 jQuery 选择器显式引用该字段，如果this被不同的上下文覆盖，或者如果您还想引用其他字段等：

x = $('myInputField').val();

问题是，在IE上，onchange事件不适用于INPUT元素。因此，您必须根据要执行的操作使用 onkeypress 或 onblur 事件。

JS方式：

document.getElementById('myInputField').onblur = function() {
    var x = this.value
}

j查询方式：

$('#myInputField').blur(function() {
    var x = this.value
})

输入字段上的简单 keyup 事件还不够吗？

j查询：

$('textarea').keyup(function() {
    $('#foo').html($(this).val());
});​

.HTML：

<textarea></textarea>
<div id="foo"></div>

jsFiddle 示例。

相关文章：