javascript - 触发附加元素上的现有事件

Question

这个问题已经有答案了:

Event binding on dynamically created elements? (23 个回答)

已关闭 7 年前。

我试图让模糊和按键(13)在已附加的元素上执行相同的操作。显然，trigger() 的用途是这样的，对吧？不工作。我希望我只是愚蠢并且错过了一些明显的东西。

$(document).ready (function() {
  $("#btn").click (function() {
    $("#this-ul").append ("<li><input id='input1' type='text'></li><li><input type='text' id='input2'></li>");
    $("#input1").focus();
  });
  $("#this-ul").on ("blur", "#input1", function() {
    $("#input2").val ("blurred");
  });
  $("#this-ul").on ("keypress", "#input1", function (e) {
    if (e.which == 13) {
      // Want to trigger $("#this-ul").on ("blur"...) as above
    }
  });
});

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

<button id="btn" type="button">Click</button>
<ul id="this-ul"></ul>

Answer 1

试试这个:

$(document).ready (function() {
    $("#btn").click (function() {
        $("#this-ul").append ("<li><input id='input1' type='text'></li><li><input type='text' id='input2'></li>");
        $("#input1").focus();
    });
    $("#this-ul").on ("blur", "#input1", function() {
        $("#input2").val ("blurred");
    });
    $("#this-ul").on ("keypress", "#input1", function (e) {
        if (e.which == 13) {
            $(this).trigger("blur");
        }
    });
});

在这里摆弄:https://jsfiddle.net/2b10cyez/

在输入 1 的 blur 上，输入 2 获取值“blurred”。
按下 [enter] 按键时，会触发模糊事件。