jQueryselect器在dynamic添加新元素后不会更新
我的select是：
$('section#attendance input:last') 但是，我将另一个input附加到＃考勤部分。 我希望select器现在select该元素（因为它应该，因为:last 。但是，由于某种原因，它不，我不太清楚为什么？
这是我的完整代码：
$('section#attendance input:last').keydown(function(e) { if (e.which == 9) { var $this = $(this); var num = parseInt($this.attr('name').match(/\d+(,\d+)?/)[0]) + 1; $this.parent().append('<input type="text" name="attendance[' + num +']" value="Name and Position" class="medium" />'); } });
新代码：
$("section#attendance").on("keydown", "input:last", function(e) { if (e.which == 9) { var $this = $(this); var num = parseInt($this.attr('name').match(/\d+(,\d+)?/)[0]) + 1; $this.after('<input type="text" name="attendance[' + num +']" value="Name and Position" class="medium" />'); } });
编辑：这个问题似乎是在'input：最后'，因为它的作品，如果我只是使用input。 此外，如果我添加类“最后”到最后一个元素，它使用“input.last”作为select器时。
根据您使用的jQuery版本，您应该使用.delegate() （在jQuery 1.7之前）或.on() （jQuery 1.7+）来委派事件处理，以处理dynamic添加的元素的事件。 注意.live()已经从所有版本的jQuery中被弃用，所以不应该再使用它。
使用.on() ，你可以使用这个：
$("#attendance").on("keydown", "input:last", function(e) { if (e.which == 9) { var $this = $(this); var num = parseInt($this.attr('name').match(/\d+(,\d+)?/)[0]) + 1; $this.parent().append('<input type="text" name="attendance[' + num +']" value="Name and Position" class="medium" />'); } });
使用.delegate()将是类似的（除了参数的顺序不同）。 你可以在jQuery doc .delegate()和.on()看到他们。
委托事件处理使用一些javascript事件的“冒泡”function。 这允许你将一个事件处理程序附加到一个父对象（它不会来来去去），并让它看着每个从子项“起泡”的事件，检查事件是否来自一个对象适当的select器，如果是的话，执行你的事件处理代码。 这样，随着物体的来去，他们的事件仍然得到适当的处理。
正如你最初做的事情一样，你将直接绑定事件处理程序到与事件绑定代码运行时select器的'section#attendance input:last'匹配的对象。 从此，它直接绑定到该特定对象，而不pipe该对象是否仍然匹配select器，或者是否将新对象添加到与select器匹配的DOM。 使用.delegate()或.on()委托事件处理允许事件处理行为更加dynamic – 自动适应DOM中的变化。 您只需将事件绑定到不会更改的公共父对象，并且可以自动监视所有子对象。
要对dynamic插入的内容做出反应，您将不得不使用委托事件。 目前推荐的function是.on() （ live已被弃用， bind和delegate被取代）。
不要使用现场！ 使用
live方法由于性能不佳而被弃用，现在使用on方法。
$('section#attendance').on('keydown', 'input:last', function(e) { /* ... code ... */ });
也没有理由有你的IDselect器前的section标签。
最有可能的问题是因为您正在使用keydown事件。 这实际上使用select器的绑定。 仅绑定第一次附加时存在的效果项目。 JQuery文档说：
bind（）将事件附加到存在的元素或在调用时匹配select器。 之后创build的任何元素或者由于类更改而向前匹配的元素都不会触发绑定的事件。
你应该看看用下面的东西replacekeydown：
$('section#attendance).on("keydown", "input:last", function(e) {...});
