Uncaught RangeError: Максимальный размер стека вызовов превышен в jquery триггерной функции

Question

Почему этот код выдает ошибку при выполнении функции trigger? Пожалуйста, сообщите мне решение.

<input />
<input />
<div id='dd'></div>

x = $('input');
x.on("input", function() {
  n = $(this).val();

  if (x.eq(0).val() == n) { 
    $('#dd').html(n); 
  }

  if (x.eq(1).val() == n) {
    x.eq(0).val(n);
    x.eq(0).trigger("input");
  }
});

Этот код jQuery выдает ошибку в консоли браузера, но я не знаю, почему.

jquery -3.4.1.min. js: 2 Uncaught RangeError: Максимальный размер стека вызовов превышен
в String.replace ()
в Function.htmlPrefilter (jquery -3.4.1.min. js: 2)
в кфн.инит. (jquery -3.4.1.min. js: 2)
в _ (jquery -3.4.1.min. js: 2)
в k.fn.init. html (jquery -3.4.1.min. js: 2)
в HTMLInputElement. (userscript. js: 5)
в HTMLInputElement.dispatch (jquery -3.4.1.min. js: 2)
в HTMLInputElement.v.handle (jquery -3.4.1 .min. js: 2)
в Object.trigger (jquery -3.4.1.min. js: 2)
в HTMLInputElement. (jquery -3.4.1.мин. js: 2)

Answer 1

Я нашел решение, в котором я использовал if(x.eq(0).val() == n) Я заменил на if(x.index(this) == 0), тогда ошибка исчезла.

x = $('input');
x.on("input", function() {
  n = $(this).val();

  if (x.index(this) == 0) {
    $('#dd').html(n);
  }

  if (x.index(this) == 1) {
    x.eq(0).val(n);
    x.eq(0).trigger("input");
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input />
<input />
<div id='dd'></div>