通过点击最后一个元素追加最后一个元素

我有两种形式：一种是活动的（不透明度1），另一种是非活动的（不透明度0.5应用于形式：最后一个孩子）。点击不活动的表单使其变为活动状态，并在其后创建另一个非活动表单。总结一下，我在点击最后一个元素后在最后一个元素后面添加html时遇到问题。 jQuery不断选择相同的元素，而不是使用新的最后一个元素。通过点击最后一个元素追加最后一个元素

HTML：

<form class="traveler traveler1"> 
    <h3>Traveler #1</h3> 
    <input type="text" placeholder="First name"> 
    <input type="text" placeholder="Last name"> 
    <input type="text" placeholder="Birth date"> 
    <input type="text" placeholder="Passport number"> 
</form> 
    <form class="traveler traveler2"> 
    <h3>Traveler #2</h3> 
    <input type="text" placeholder="First name"> 
    <input type="text" placeholder="Last name"> 
    <input type="text" placeholder="Birth date"> 
    <input type="text" placeholder="Passport number"> 
</form>

的jQuery：

$(function(){ 
    function addTraveler(){ 
     $number = $('.traveler').length; 
     $number++; 
     $('form.traveler').last().after('<form class="traveler traveler' + $number + '"><h3>Traveler #' + $number + '</h3><input type="text" placeholder="First name"><input type="text" placeholder="Last name"><input type="text" placeholder="Birth date"><input type="text" placeholder="Passport number"></form>'); 
    } 

    $('.traveler').last().on('click', function(){ 
     $('form.traveler').last().after(addTraveler); 
    }); 
})

我可以通过点击第二个表格（这是旧的最后形式）创造新的形式，但它并不在我上班点击新的最后一张表格。

我一直在努力，现在几个小时，任何援助将不胜感激:)

来源

2014-02-27 Laink

您需要点击事件委托给你的动态创建的元素

LIVE DEMO

假设您的所有表格都在里面#container

$('#container').on('click', ".traveler:last", addTraveler);

你不需要再次使用.after()导致你的功能为你做了所有的事情。

关于.on()方法事件代表团，您可以准备更多here（直接和委托的事件）

来源

2014-02-27 01:25:22

通过点击最后一个元素追加最后一个元素

回答

相关问题