Jquery 为什么“模糊”和“聚焦”对附加的输入文本字段不起作用？

呃。有人能给我解释一下为什么模糊和聚焦事件不能处理附加的输入文本字段吗

正如你在这张照片上看到的。在html中创建的输入字段似乎监听模糊和聚焦事件。 但是，当您使用append按钮附加输入文本字段时，输入文本字段会突然不听模糊/聚焦事件

HTML

jQuery

你能解释一下为什么这对附加的输入文本字段不起作用吗？

---

提前感谢。

您需要使用on将事件委托给动态添加元素的父级

委派事件的优点是，它们可以从中处理事件 以后添加到文档中的子元素。通过 选择一个元素，该元素保证在 已附加委派事件处理程序，您可以使用委派事件 避免频繁附加和删除事件处理程序，

---

您需要使用on将事件委托给动态添加的元素的父级

委派事件的优点是，它们可以从中处理事件 以后添加到文档中的子元素。通过 选择一个元素，该元素保证在 已附加委派事件处理程序，您可以使用委派事件 避免频繁附加和删除事件处理程序，

---

你怎么知道的？你怎么知道的？

<input class="input" value="value 1">
<input class="input" value="value 2">
<div id="appendinput">Append a input textfield</div>
<div id="inputcontainer"></div>

var counter = 0;

$("#appendinput").click(function () {
    $('<input class="input" value="value 3" type="text" id="input' + (counter) + '"/>').appendTo('#inputcontainer');
    counter++;
});


$('.input').on('focus', function () {
    thisValue = $(this).val();
    $(this).attr("value", "");
});
$('.input').on('blur', function () {
    if ($(this).val() === "") {
        $(this).val(thisValue);
    }
});

$(document).on('focus', '.input', function () {
    thisValue = $(this).val();
    $(this).attr("value", "");
});