Question

检查以下html代码。 id foo输入取一个文本，然后克隆到另一个输入id doo。如您在jquery代码中看到的，我只是将值从foo传递到doo。但是我的问题是，当我尝试在jquery的代码的第二部分获取doo的值时，我没有得到doo的更新值。问题是，如果我在foo中写输入，那么它实际上会在doo中显示，但实际上我认为这不会改变。所以我想要的是-当我在foo中传递输入时，它也会在doo值中触发。由于我也在从doo更新foo。询问问题是否想知道更多。预先感谢

jsfiddle link

jQuery：

$("#foo").keyup(function () {
         $('#doo').val($(this).val());

        });



$("#doo").on("change paste keyup", function () {
            var tryGetNewValue = $('#doo').val();
            console.log(tryGetNewValue);
        });

HTML：

<input type="text" id="foo" value=""><br>
<br>
<input type="text" id="doo" value=""><br>

Answer 1

问题在于这些功能同时运行，并且doo的值没有及时更改。我会将您的js代码更改为此：

ECHO is on.
ECHO is on.
ECHO is on.

然后显然可以运行在两个都运行var tryGetNewValue的地方运行的任何东西

Answer 2

不会触发change事件，因为只有直接从用户输入到元素中才能将其设置为关闭（请参见https://developer.mozilla.org/en-US/docs/Web/Events/change）。

关于允许它起作用的方法，您可以为每个事件使用一个函数，如下所示：

$("#foo").keyup(function () {
   $('#doo').val($(this).val());
   changeEvent();
});

$("#doo").on("change paste keyup", function () {
   changeEvent()
}); 

function changeEvent(){
   var tryGetNewValue = $('#doo').val();
   console.log(tryGetNewValue);
}

Answer 3

最好使用jquery的deligate函数。这两个功能都会更改两个输入值。

 $(document).on("input paste keyup","#doo,#foo", function (e) {
     $("#foo").val($(this).val());
     $("#doo").val($(this).val());
     var tryGetNewValue = $(this).val();
     console.log(tryGetNewValue);
 });

您甚至可以像下面这样得到

$( "body" ).delegate( "#doo, $foo", "input paste keyup", function(e) {
  $("#foo").val($(this).val());
  $("#doo").val($(this).val());
  var tryGetNewValue = $(this).val();
  console.log(tryGetNewValue);
});

将值设置为输入并在更改或键入时获取它

3 个答案: