我的选择是不更新：jQuery选择后动态添加新元素

$('section#attendance input:last')

不过，我附上另一个输入部分＃出席。我想选择现在选择该元素（因为它应该的，因为: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.last'作为选择器时起作用

来源

2012-02-19 chintanparikh

取决于你所使用的jQuery的版本，您应该使用.delegate()或.on()（jQuery的（jQuery的1.7之前）1.7+ ）具有委托事件处理，该处理将处理动态添加的元素的事件。注意.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事件的“冒泡”功能。这允许你将一个事件处理程序附加到一个父对象（它不会来来去去），并让它查看每个从孩子“冒泡”到它的事件，检查事件是否来自具有适当的选择器，如果是的话，执行你的事件处理代码。这样，当物体来来去去时，他们的事件仍然得到适当的处理。

正如您最初做的事情那样，您将事件处理程序直接绑定到在事件绑定代码运行时与选择器'section#attendance input:last'匹配的对象。从此，它直接绑定到该特定对象，而不管该对象是否仍与选择器匹配，或者是否将新对象添加到与选择器匹配的DOM。使用.delegate()或.on()的委托事件处理允许事件处理行为更具动态性 - 自动适应DOM中的更改。您只需将事件绑定到不会更改的公共父对象，并且它可以自动监视它的所有子对象。

来源

2012-02-19 03:15:08 jfriend00

嘿，我试了一下，但由于某种原因，它似乎没有工作。我已经用新代码更新了我的帖子，并且已经查看了.on（）的文档，但是我无法弄清楚什么是错误的。欢呼的帮助！ – chintanparikh 2012-02-19 04:35:32

问题是您添加的输入标记没有您的代码所期望的正确类型的名称属性。您没有透露您的HTML，但是由于它从名称属性中解析出数字的方式，因此您的代码无法工作。你的正则表达式匹配两个数字之间的逗号，但你添加的新输入标签没有这种格式。你可以在这里看到一个更简单的版本：http://jsfiddle.net/jfriend00/uVHwK/。我们不得不看到你的HTML更具体的建议。 – jfriend00 2012-02-19 04:54:33

要对动态插入的内容做出反应，您将不得不使用委托事件。目前推荐的功能是.on()（live已弃用，bind和delegate被取代）。

来源

2012-02-19 03:14:28 nijansen

'bind'和'delegate'不被弃用。 – 2012-02-19 03:17:20

你说得对。 'live'被弃用，'bind'和'delegate'被取代。 – nijansen 2012-02-19 03:19:42

问题最有可能是因为您正在使用keydown事件。这实际上使用选择器的绑定。仅绑定第一次附加时存在的效果项目。 JQuery文档说：

bind（）将事件附加到存在的元素或与调用时匹配选择器。之后创建的任何元素或者因类更改而前进的元素都不会触发绑定事件。

你应该看的东西，如以下取代的keydown：

$('section#attendance).on("keydown", "input:last", function(e) {...});

来源

2012-02-19 03:15:00 AlexGad

请勿使用！使用on

实时方法由于性能不佳而不推荐使用，而是现在使用on方法。

$('section#attendance').on('keydown', 'input:last', function(e) { 
    /* ... code ... */ 
});

也没有理由让您的帐号选择面前section标签。

来源

2012-02-19 03:18:40

jQuery选择后动态添加新元素

回答

请勿使用！使用on

相关问题