Javascript 在Jquery中使用replaceWith（）函数创建表单，但无法使用Jquery验证插件进行验证

我已经创建了html页面，它有空的division标记，使用jquery我可以替换空div标记中的表单。这些步骤工作正常。但当尝试验证以前使用replaceWith（）函数创建的表单时，完全不受支持。我使用jquery验证插件进行验证过程，代码如下

Jquery替换函数

$(document).ready(function () {
    $("#add_new_parent").click(function () {
        $("#family_page_body").replaceWith("<form name='add-parent' id='add-parent' action='#' method='post'>
<div class='row'>
<div class='col-md-4'> <label for='nic'>NIC Number :</label>
 </div>
</div>
<div class='row'>
<div class='col-md-4'>
<input type='text' name='txt_nic' style='height: 35px;' class='form-control' id='txt_nic' autocomplete='off' placeholder='Enter your NIC Number'>
</div></div></form>");
});
});

这是一个Html页面

<div class="middle-box">
                    <br/>
                    <div id="family_page_body">

                        <br/>
                    </div>

                </div>

您正在调用文档就绪中的

.validate（）

方法

$(document).ready(function () {
    $("#add-parent").validate({ ....

这就是你的全部问题

调用

.validate（）

时，表单尚不存在，因此无法在其上初始化验证插件

创建表单后，必须调用

.validate（）

方法

$(document).ready(function () {

    $("#add_new_parent").click(function () {

        // FIRST -> create the form
        $("#family_page_body").replaceWith("<form name='add-parent' id='add-parent' action='#' method='post'>....</form>");

        // SECOND -> initialize validation plugin on your new form
        $("#add-parent").validate({
            ....
        });

    });

});

$（文档）.ready（函数（）{
$（“#添加新父项”）。单击（函数（）{
//首先->创建表单
$（“#家庭#页面#正文”）。替换为（“..”）；
//第二->在新表单上初始化验证插件
$（“#添加父项”）。验证({
....
});
});
});

$(document).ready(function () {

    $("#add_new_parent").click(function () {

        // FIRST -> create the form
        $("#family_page_body").replaceWith("<form name='add-parent' id='add-parent' action='#' method='post'>....</form>");

        // SECOND -> initialize validation plugin on your new form
        $("#add-parent").validate({
            ....
        });

    });

});