Javascript 更改选择选项后，未启用输入字段

我已经为启用/禁用输入字段创建了一个独立的代码，它工作得非常好。 HTML:

但是，当我试图以另一种形式整合这一逻辑时，它并不起作用

HTML:

选择合适的一方：



人


组织



*姓氏：


*机构名称：

标识类型：
标识类型：
--挑选--
--sdsd--
--cxc--
--cvcv--
管理系统类型：
管理员类型：
--挑选--


*管理系统值：

JS:

$（文档）.ready（函数（）{
var计数器=0；
$（'input[name=Organization name]'）。attr（'disabled'，true）；
$（'input[name=IdentificationNumber]'）。attr（'disabled'，true）；
$（'input[name=Family name]'）.attr（'disabled'，true）；
$（'input[name=Adminsys Number]'）.attr（'disabled'，true）；
$（'#pancettaForm'）。更改（函数（）{
$（'.Organization Name'）。单击（函数（）{
如果（$（'.Organization Name'）。是（':checked'））{
$（'input[name=Organization name]'）.val（''.attr（'disabled'，false）；
}否则{
$（'input[name=Organization name]'）。attr（'disabled'，true）；
}
});
$（'select[name=“Identification Type'+counter+'”）。更改（函数（）{
变量$this=$（'.identificationnumber'）；
var$input=$this.sibbins（'input[type=text]'）；
$input.attr（“已禁用”，错误）；
$input.attr（“已禁用”）（$（this.val（）==“1111”）？true:false）；
});
$（'.Adminsys Number'）。单击（函数（）{
如果（$（'.Adminsys Number'）。是（':checked'））{
$（'input[name=Adminsys Number]'）.val（''.attr（'disabled'，false）；
}否则{
$（'input[name=Adminsys Number]'）.attr（'disabled'，true）；
}
});
$（'.Family Name'）。单击（函数（）{
如果（$（'.Family Name'）。是（':checked'））{
$（'input[name=Family name]'）.val（''.attr（'disabled'，false）；
}否则{
$（'input[name=Family name]'）.attr（'disabled'，true）；
}
});
$（“#姓氏，#标识号，#组织名称”）.hide（）；
如果（$（'person'）.prop（'checked'））{
$（“#姓氏，#标识类型，#标识号，#管理员编号，#管理员类型，#添加行，#删除行”）.show（）；
}else if（$（“#组织”）.prop（'checked'））{
$（“#组织名称，#标识类型，#标识号，#管理员编号，#管理员类型，#添加行，#删除行”）.show（）；
}
});
$('', {
“类”：“外部人员”，
html:GetHtml（）
}).appendTo（“#container”）；
$（'#addRow'）。单击（函数（）{
如果（计数器>10）{
警报（“仅允许10个文本框”）；
返回false；
}
$('', {
“类”：“外部人员”+计数器，
'id'：'extraPerson'+计数器，
html:GetHtml（）+“”
}).hide（）.appendTo（“#container”）.slideDown（'slow'）；
计数器++；
});
$（“#容器”）。在（'click'，'.removeRow'，函数（）{
//$（“#外人”+计数器）。删除（）；
如果（计数器<1）{
警报（“不再需要删除文本框”）；
返回false；
}
计数器--；
$（this.parent（）.remove（）；
});
函数GetHtml（）{
//var len=$（'.extraPerson'）.length；
var$html=$（'.extraPersonTemplate'）.clone（）；
如果（计数器==0）{
$html.find（'[name=标识号]'）[0].name=“标识号”+计数器；
$html.find（'[id=IdentificationNumber]'）[0].name=“IdentificationNumber”+计数器；
$html.find（'[name=IdentificationType]'）[0].name=“IdentificationType”+计数器；
计数器++；
返回$html.html（）；
}否则{
$html.find（'[name=标识号]'）[0].name=“标识号”+计数器；
$html.find（'[id=IdentificationNumber]'）[0].name=“IdentificationNumber”+计数器；
$html.find（'[name=IdentificationType]'）[0].name=“IdentificationType”+计数器；
//$html.find（'[id=IdentificationType]'）[0].id=“IdentificationType”+计数器；
//var remove=''；
返回$html.html（）；
}
}
})

---

如何动态更改select属性的名称，以便有选择地启用和禁用多行中的输入字段。

希望这对您有所帮助，我希望我的操作正确：

我修改了youchange函数，该函数确定选择框并启用输入字段，如下所示

$('.Identification-Type').change(function () {
    //#Identification-Type input
    /** this can be used to count the input fields and use it in a loop later **/
    var $inputFields = $('.extraPersonTemplate #Identification-Type input').length;

    var $idNumber = $('input[name=Identification-Number]');
    var $idNumber0 = $('input[name=Identification-Number0]');
    ($('select[name=Identification-Type]').val() == '1111') ? $idNumber.attr('disabled', true) :  $idNumber.removeAttr('disabled');
    ($('select[name=Identification-Type0]').val() == '1111') ? $idNumber0.attr('disabled', true) :  $idNumber0.removeAttr('disabled')
})

但在我看来，这并不是最好的方法，因为它不是动态的。 如果您设法对

选择[name=Identification Type]+计数器进行计数，不仅对一个输入，而且对两个输入都进行计数，如
和
，则可以在此更改函数中包含一个循环，并在找到的
$inputFields
上循环，这在过去对我有帮助。。。试试看
  $('select[name="Identification-Type"]').change(function () {

              var $this = $('#Identification-Number');


                 $this.attr("disabled", false);
            $this.attr("disabled", ($(this).val() == '1111') ? true : false);

            }).trigger('change');

        <form name="pancettaForm" method="post" action="demor" id="pancettaForm">
    <ul>
        <li>
            <label for="PartyChoose">Choose Appropriate Party:</label>
        </li>
        <br>
        <input id="person" name="PartyChoose" type="radio" value="update-person" class="required" />Person
        <br />
        <input id="organization" name="PartyChoose" type="radio" value="update-organization" class="required" />Organization
        <br />
        <li id="Family-Name" style="display: none;">
            <input type="checkbox" class="Family-Name" value="Family-name" name="Family-name">
            <label for="Family-Name"><em>*</em>Family Name:</label>
            <input type="text" name="Family-Name" class="required">
        </li>
        <li id="Organization-Name" style="display: none;">
            <inpname="Organization-name">
                <label for="Organization-Name"><em>*</em>Organization Name:</label>
                <input type="text" name="Organization-Name" class="required">
        </li>
        <div class="extraPersonTemplate">
            <div class="controls-row">
                <li id="Identification-Type" style="display: none;">Identification Type:
                    <select name="Identification-Type" class="Identification-Type">
                        <label for="Identification-Type">Identification Type:</label>
                        <option value="1111">--Select--</option>
                        <option value="1">--sdsd--</option>
                        <option value="2">--cxc--</option>
                        <option value="3">--cvcv--</option>
                        <select>    <a id="Identification-Number" style="display: none;">
                  <input type="hidden" class="Identification-Number">                                
                                <label for="Identification-Number"><em>*</em>Identification Number:</label>
                                <input type="text" name="Identification-Number">
                                    </a>

                </li>
            </div>
        </div>
        <div id="container"></div>
<a href="#" id="addRow" style="display: none;"><i class="icon-plus-sign icon-white">
</i> Add Identifier</a>

        <li id="Adminsys-Type" style="display: none;">Admin System Type:
            <select name="Adminsys-Type" class="Adminsys-Type">
                <label for="Adminsys-Type">Admin Type:</label>
                <option value="0">--Select--</option>
            </select>
        </li>
        <li id="Adminsys-Number" style="display: none;">
            <input type="checkbox" class="Adminsys-Number" value="Adminsys-Number" name="Adminsys-number">
            <label for="Adminsys-Number"><em>*</em>Admin System Value:</label>
            <input type="text" name=Adminsys-Number>
        </li>
    </ul>
    <input type="submit" id="button" name="submit" value="Search">
</form>

        $(document).ready(function () {

    var counter = 0;



    $('input[name=Organization-Name]').attr('disabled', true);
    $('input[name=Identification-Number]').attr('disabled', true);
    $('input[name=Family-Name]').attr('disabled', true);
    $('input[name=Adminsys-Number]').attr('disabled', true);

    $('#pancettaForm').change(function () {


        $('.Organization-Name').click(function () {
            if ($('.Organization-Name').is(':checked')) {
                $('input[name=Organization-Name]').val('').attr('disabled', false);
            } else {
                $('input[name=Organization-Name]').attr('disabled', true);
            }

        });

        $('select[name="Identification-Type' + counter + '"]').change(function () {

            var $this = $('.Identification-Number');
            var $input = $this.siblings('input[type=text]');
            $input.attr("disabled", false);
            $input.attr("disabled", ($(this).val() == '1111') ? true : false);
        });


        $('.Adminsys-Number').click(function () {
            if ($('.Adminsys-Number').is(':checked')) {
                $('input[name=Adminsys-Number]').val('').attr('disabled', false);
            } else {
                $('input[name=Adminsys-Number]').attr('disabled', true);
            }

        });
        $('.Family-Name').click(function () {
            if ($('.Family-Name').is(':checked')) {
                $('input[name=Family-Name]').val('').attr('disabled', false);
            } else {
                $('input[name=Family-Name]').attr('disabled', true);
            }

        });
        $('#Family-Name,#Identification-Number,#Organization-Name').hide();
        if ($('#person').prop('checked')) {
            $('#Family-Name,#Identification-Type,#Identification-Number,#Adminsys-Number,#Adminsys-Type,#addRow,#removeRow').show();


        } else if ($('#organization').prop('checked')) {
            $('#Organization-Name,#Identification-Type,#Identification-Number,#Adminsys-Number,#Adminsys-Type,#addRow,#removeRow').show();

        }
    });
    $('<div/>', {
        'class': 'extraPerson',
        html: GetHtml()
    }).appendTo('#container');




    $('#addRow').click(function () {
        if (counter > 10) {
            alert("Only 10 textboxes allow");
            return false;
        }



        $('<div/>', {
            'class': 'extraPerson' + counter,
                'id': 'extraPerson' + counter,
            html: GetHtml() + '<a href="javascript:void(0);" class="removeRow" ><i class="icon-plus-sign icon-white"></i> Remove Identifier</a>'
        }).hide().appendTo('#container').slideDown('slow');



        counter++;


    });



    $("#container").on('click', '.removeRow', function () {
        //$("#extraPerson"+counter).remove();
        if (counter < 1) {
            alert("No more textbox to remove");
            return false;
        }
        counter--;
        $(this).parent().remove();


    });

    function GetHtml() {
        // var len = $('.extraPerson').length;

        var $html = $('.extraPersonTemplate').clone();
        if (counter == 0) {
            $html.find('[name=Identification-Number]')[0].name = "Identification-Number" + counter;
            $html.find('[id=Identification-Number]')[0].name = "Identification-Number" + counter;
            $html.find('[name=Identification-Type]')[0].name = "Identification-Type" + counter;

            counter++;
            return $html.html();

        } else {
            $html.find('[name=Identification-Number]')[0].name = "Identification-Number" + counter;
            $html.find('[id=Identification-Number]')[0].name = "Identification-Number" + counter;
            $html.find('[name=Identification-Type]')[0].name = "Identification-Type" + counter;

            // $html.find('[id=Identification-Type]')[0].id="Identification-Type" + counter;

            // var remove='<a href="javascript:void(0);" class="removeRow" ><i class="icon-plus-sign icon-white"></i> Remove Identifier</a>';
            return $html.html();
        }
    }
})

$('.Identification-Type').change(function () {
    //#Identification-Type input
    /** this can be used to count the input fields and use it in a loop later **/
    var $inputFields = $('.extraPersonTemplate #Identification-Type input').length;

    var $idNumber = $('input[name=Identification-Number]');
    var $idNumber0 = $('input[name=Identification-Number0]');
    ($('select[name=Identification-Type]').val() == '1111') ? $idNumber.attr('disabled', true) :  $idNumber.removeAttr('disabled');
    ($('select[name=Identification-Type0]').val() == '1111') ? $idNumber0.attr('disabled', true) :  $idNumber0.removeAttr('disabled')
})

$('#wow').change(function() {
// Remove any previously set values
$('#show_box, #total_box').empty();
var sum = 0,
    price;
$(this).find('option:selected').each(function() {
    // Check that the attribute exist, so that any unset values won't bother
    if ($(this).attr('data-price')) {            
        price = $(this).data('price');
        sum += price;
 $('#show_box').append('<h6>' + price + '</h6>');
      }
    });
 $('#total_box').text(sum);