динамически определять, если значение текстового поля изменяется

Question

Можно ли обнаружить изменение текстового поля, даже если это значение текстового поля не введено пользователем, как в приведенном ниже сценарии? У меня есть несколько сценариев, например, когда страница загружается в первый раз, когда texbox загружается с данными.

$("#txt1").change(function(){
  $("#txt2").val("1")
  //$("#txt2").change();
});

$('#txt2').on("change", function() {
  // some computation will happen here.
  alert("1");
});

$("#btn1").click(function(){
  $("#txt2").val("1");
});

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

<input type="text" id="txt1">
<input type="text" id="txt2" name='text1'>
<button id="btn1">
    Click
</button>

Answer 1

Значение, измененное JavaScript , не вызывает событие, поэтому вы просто не можете перехватить событие в этом случае. Вы можете реализовать наблюдатель для вашего входного значения, используя интервал

var oldValue = $("#txt2").val();
setInterval(function() {
    var currentValue = $("#txt2").val();
    if (currentValue !== oldValue) {
      $("#txt2").trigger("change");
      oldValue = currentValue;
    }
}, 100);

$("#txt1").change(function(){
  $("#txt2").val("1")
});

$('#txt2').on("change", function() {
  // some computation will happen here.
  alert("1");
});

$("#btn1").click(function(){
  $("#txt2").val("1");
});

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


<input type="text" id="txt1">
<input type="text" id="txt2" name='text1'>
<button id="btn1">
Click
</button>

Answer 2

Поскольку вы знаете, что при изменении события textbox1 вы изменяете значение второго текстового поля, вам нужно запустить его вручную

$(document).ready(function () {

 $("#txt1").change(function () {

   $("#txt2").val("1")
   $("#txt2").trigger("change");

 });

 $("#txt2").change(function () {

    alert("1");

 });

})