只读对 jquery 中的更改

Question

我想为jquery 中on change的read-only输入触发一个事件，然后在它下面附加一些 HTML 代码。所以基本上，每当 read-only输入发生变化时，HTML都应该附加代码。

请在下面查看我的代码。

$(function(){

    $(document).on('click', 'button', function(){

  

    $('#holder').val($('#getter').val());

  

  });

  

  // This part

    $('#holder').on('change', function(){

  

    $('.here').append("<p>Inputted</p>");

  

  });

});

input[readonly=""]{

  

  background: #ccc;

  

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<br><br>

<input type="text" id="holder" readonly="">

<input type="text" id="getter">

<button>Go</button>

<br>

<br>

<div class="here"></div>

Answer 1

您可以添加.trigger("change")到$('#holder').val($('#getter').val());然后它会起作用；演示$(function() {&nbsp; $(document).on('click', 'button', function() {&nbsp; &nbsp; $('#holder').val($('#getter').val()).trigger("change");&nbsp; });&nbsp; $('#holder').on('change', function() {&nbsp; &nbsp; $('.here').append("<p>Inputted</p>");&nbsp; });});input[readonly=""] {&nbsp; background: #ccc;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script><br><br><input type="text" id="holder" readonly=""><input type="text" id="getter"><button>Go</button><br><br><div class="here"></div>

Answer 2

这应该是你要找的它只能通过一个事件来完成$(function(){&nbsp; $(document).on('click', 'button', function(){&nbsp;&nbsp;&nbsp; $('#holder').val($('#getter').val());&nbsp;&nbsp;&nbsp; $('.here').append("<p>Inputted</p>");&nbsp;&nbsp;&nbsp; });&nbsp;&nbsp;});input[readonly=""]{&nbsp;&nbsp;&nbsp; background: #ccc;&nbsp;&nbsp;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script><br><br><input type="text" id="holder" readonly=""><input type="text" id="getter"><button>Go</button><br><br><div class="here"></div>