Javascript JS使用来自两个不同来源的函数

我有三个单选按钮，每个按钮的选择都会改变#show div中的内容。 当页面加载时，div包含一个dinamic表单，它可以完美地工作。 在我选择其中一个单选按钮并返回表单状态后，动态表单不会添加更多字段

我对JS有点陌生，我无法发现问题。 任何帮助都会很好

我不知道问题出在哪里 任何关于更好问题标题的建议都将被接受

这是动态场函数

$(document).ready(function () {
        $("#addm").click(function () {
            var intIdm = $("#buildyourformm div").length + 1;
            var fieldWrapper = $("<div class=\"fieldwrapper\" name=\"field[]\" id=\"fieldm" + intIdm + "\"/>");
            var wfnamem = $("<div class=\"col-sm-5\"> <input type=\"text\" placeholder=\field 1\"  name=\"inputwFname[]\" class=\"form-control\"></div>\" ");
            var wlnamem = $("<div class=\"col-sm-5\"> <input type=\"text\" placeholder=\"field 2\"  name=\"inputwLname[]\" class=\"form-control\"></div>\" ");


            var removeButtonm = $("<input type=\"button\" class=\"remove-btn btn-warning\" value=\"remove\" />");
            removeButtonm.click(function () {
                $(this).parent().remove();
            });

            fieldWrapper.append(wfnamem);
            fieldWrapper.append(wlnamem);
            fieldWrapper.append(removeButtonm);
            $("#buildyourformm").append(fieldWrapper);
        });
    });

$（文档）.ready（函数（）{
$（“#addm”）。单击（函数（）{
var intIdm=$（“#buildyourformm div”）。长度+1；
var fieldWrapper=$（“”）；
var wfnamem=$（“问题在于您没有在add按钮上委托一个click处理程序，因此当您操作dom（删除附加）时，与特定id的绑定将不起作用，因为您删除了元素，我还将click处理程序合并到了ready函数中，您不需要两个ready函数

$(document).ready(function(){
        $('input[type=radio]').change(function(){
        var n = $(this).val();
        switch(n)
        {
                case '1':
                      $('#show').html('<fieldset id="buildyourformm"><div name="field1" id="field1"><div><input type="text" placeholder="field 1"  name="inputwFname[]"></div><div><input type="text" placeholder="field 2" name="inputwLname[]" class="form-control"></div><input type="button"  value="remove"></div></fieldset><input type="button" value="add" id="addm" /><br><br><br></div></div></div></fieldset>');
                      break;
                case '2':
                      $('#show').html("2nd radio button");
                      break;
                case '3':
                      $('#show').html("3rd radio button");
                      break;
            }
        });


            $("#show").on("click","#addm",function (event) {
                var intIdm = $("#buildyourformm div").length + 1;
                var fieldWrapper = $("<div class=\"fieldwrapper\" name=\"field[]\" id=\"fieldm" + intIdm + "\"/>");
                var wfnamem = $("<div class=\"col-sm-5\"> <input type=\"text\" placeholder=\field 1\"  name=\"inputwFname[]\" class=\"form-control\"></div>\" ");
                var wlnamem = $("<div class=\"col-sm-5\"> <input type=\"text\" placeholder=\"field 2\"  name=\"inputwLname[]\" class=\"form-control\"></div>\" ");


                var removeButtonm = $("<input type=\"button\" class=\"remove-btn btn-warning\" value=\"remove\" />");
                removeButtonm.click(function () {
                    $(this).parent().remove();
                });

                fieldWrapper.append(wfnamem);
                fieldWrapper.append(wlnamem);
                fieldWrapper.append(removeButtonm);
                $("#buildyourformm").append(fieldWrapper);
            });
    });

$（文档）.ready（函数（）{
$（'input[type=radio]'）。更改（函数（）{
var n=$（this.val（）；
开关（n）
{
案例“1”：
$（'#show'）.html（'


'）；
打破
案例“2”：
$（'#show'）.html（“第二个单选按钮”）；
打破
案例“3”：
$（'#show'）.html（“第三个单选按钮”）；
打破
}
});
$（“#显示”）。在（“单击”，“添加”，函数（事件）{
var intIdm=$（“#buildyourformm div”）。长度+1；
var fieldWrapper=$（“”）；
变量wfnamem=$（“这是因为，当您的document ready函数第一次将EventHandler附加到UI按钮时，但是当您选择另一个单选按钮并再次返回表单时，虽然它看起来是同一个表单，但事实并非如此。因为根据您的代码，基于单选按钮，您再次呈现控件。但是这次，文档就绪将不会执行，因为它实际上不是刷新

我对你的代码做了一点修改，检查一下这把小提琴

$(document).ready(function(){
    $('input[type=radio]').change(function(){
    var n = $(this).val();
    switch(n)
    {
            case '1':
                  $('#show').html('<fieldset id="buildyourformm"><div name="field1" id="field1"><div><input type="text" placeholder="field 1"  name="inputwFname[]"></div><div><input type="text" placeholder="field 2" name="inputwLname[]" class="form-control"></div><input type="button"  value="remove"></div></fieldset><input type="button" value="add" id="addm" /><br><br><br></div></div></div></fieldset>');
                  tieEvents();
                  break;
            case '2':
                  $('#show').html("2nd radio button");
                  break;
            case '3':
                  $('#show').html("3rd radio button");
                  break;
        }
    });
});




$(document).ready(function () {
    tieEvents();
        });

function tieEvents() {
    $("#addm").click(function () {
            var intIdm = $("#buildyourformm div").length + 1;
            var fieldWrapper = $("<div class=\"fieldwrapper\" name=\"field[]\" id=\"fieldm" + intIdm + "\"/>");
            var wfnamem = $("<div class=\"col-sm-5\"> <input type=\"text\" placeholder=\field 1\"  name=\"inputwFname[]\" class=\"form-control\"></div>\" ");
            var wlnamem = $("<div class=\"col-sm-5\"> <input type=\"text\" placeholder=\"field 2\"  name=\"inputwLname[]\" class=\"form-control\"></div>\" ");


            var removeButtonm = $("<input type=\"button\" class=\"remove-btn btn-warning\" value=\"remove\" />");
            removeButtonm.click(function () {
                $(this).parent().remove();
            });

            fieldWrapper.append(wfnamem);
            fieldWrapper.append(wlnamem);
            fieldWrapper.append(removeButtonm);
            $("#buildyourformm").append(fieldWrapper);
        });

}

$（文档）.ready（函数（）{
$（'input[type=radio]'）。更改（函数（）{
var n=$（this.val（）；
开关（n）
{
案例“1”：
$（'#show'）.html（'


'）；
tievents（）；
打破
案例“2”：
$（'#show'）.html（“第二个单选按钮”）；
打破
案例“3”：
$（'#show'）.html（“第三个单选按钮”）；
打破
}
});
});
$（文档）.ready（函数（）{
tievents（）；
});
函数tievents（）{
$（“#addm”）。单击（函数（）{
var intIdm=$（“#buildyourformm div”）。长度+1；
var fieldWrapper=$（“”）；
变量wfnamem=$（“