1

HTML：

<fieldset>      
   <select>
      <option value="">Position</option>
   </select>
   <input type="text" />
   <select>
      <option value="">Function</option>
   </select>
   <input type="button" class="buttonAnd" value="And" />
   <input type="button" class="buttonOr" value="Or" />
</fieldset>

jQuery：

$(document).ready(function() {
    field_count = 0;

    $(".buttonAnd").click(function(){
        field_count++;
        $('fieldset').append(jQuery("<br />"));
        var new_field = jQuery("<input type=\"button\" />")
        new_field.attr("class","buttonAnd");
        new_field.attr("name","buttonAnd_"+field_count);
        new_field.attr("value","And_"+field_count);
        $('fieldset').append(new_field);
    });
});

附加新按钮仅适用于原始的两个按钮，但不适用于新生成的按钮。知道如何解决这个问题吗？

天呐！

谢谢特拉维斯J！我已经尝试过您的解决方案并且它有效。也感谢其他所有人！

4

3 回答 3

2

jsFiddle Demo

使用带有jQ​​uery 的on事件委托。这将允许您未来的元素将事件委托给他们

field_count = 0;

$("body").on("click",".buttonAnd",function(){
    field_count++;
    $('fieldset').append(jQuery("<br />"));
    var new_field = jQuery("<input type=\"button\" />")
    new_field.attr("class","buttonAnd");
    new_field.attr("name","buttonAnd_"+field_count);
    new_field.attr("value","And_"+field_count);
    $('fieldset').append(new_field);
});
于 2013-04-29T19:13:46.670 回答
1

您需要使用.on()因为您“即时”创建这些新按钮。所以你需要的是事件委托。否则脚本不会注意到有新按钮

看我的小提琴。

$(document).ready(function() {
    field_count = 0;

    $(".buttonAnd").on('click', function(){
        field_count++;
        $('fieldset').append(jQuery("<br />"));
        var new_field = jQuery("<input type=\"button\" />");
        new_field.attr("class","buttonAnd");
        new_field.attr("name","buttonAnd_"+field_count);
        new_field.attr("value","And_"+field_count);
        $('fieldset').append(new_field);
    });
});
于 2013-04-29T19:14:58.350 回答
0

您几乎自己回答了您的问题 - 这是因为.click()事件被分配给在分配事件时存在的按钮。如果您也需要它为新生成的按钮工作，那么您必须在创建新按钮后将事件分配给它们，注意不要第二次将其分配给原始按钮。

于 2013-04-29T19:13:56.390 回答