Question

我正在做＆＃39;添加更多＆＃39;技能的功能。

所以我的形式就像，

<form id="myform">
    <a id="add_more">Add more</a>
    <div id="skills_wrap">
        <input type="text" name="skills[]"> 
    </div>
    <input type="submit" name="submit">
</form>

脚本就像，

<script>
$(document).on("click","#add_more",function(){
  $("#skills_wrap").append('<input type="text" name="skills[]">');
});

$("#myform").validate({
    rules:{
        "skills[]":{ required:true }
    }
});
</script>

此处，验证仅适用于第一个文本框。为了增加更多技能，文本框验证不起作用。

非常感谢任何解决方案。

Answer 1

我找到了解决方案：

我在所有文本框中添加了一个公共类，并更新了点击事件中的代码，添加了更多链接，如下所示：

$(document).on("click","#add_more",function(){

    var i = $(".skill_name").length;

    $("#skills_wrap").append('<input type="text" name="skills['+i+']" class="skill_name" required>');

    $("input[name='skills["+i+"]']").rules("add", {
        required: true
    });

});

验证不适用于动态生成的元素

1 个答案: