Question

我想在动态创建的textarea元素上附加焦点事件。我在下面创建了一个小提琴来描述我的问题。当我点击“点击”链接时，会创建另一个文本区域。它没有得到焦点事件。

$("textarea").on("focus", function(){
    alert("textarea focus");
    $(this).blur();
});

$("a").click(function(){
    $("div").append("<textarea>2</textarea>");
});

http://jsfiddle.net/LepvD/2/

如何在动态textarea上添加焦点事件？我想避免再次为每个新元素重复附加焦点

Answer 1

您需要在此使用event delegation，因为您的textarea是动态创建的：

$(document).on("focus","textarea", function(){
    alert("textarea focus");
    $(this).blur();
});

它可以帮助您在这些新添加的focus

上绑定textarea事件

<强> Updated Fiddle

Answer 2

你应该使用event delegation.use：

 $(document).on("focus","textarea", function(){
    alert("textarea focus");
    $(this).blur();
});

<强> Working Fiddle

Answer 3

使用委托事件，因为它们可以处理来自稍后添加到文档的后代元素的事件。

正在动态创建textarea。

您需要使用Event Delegation。您必须使用委托事件方法来使用.on()。

$("div").on("focus", "textarea", function(){
    alert("textarea focus");
    $(this).blur();
});

Live Demo

将焦点事件附加到动态文本区域

3 个答案: