Jquery 选择按名称或 ID 删除属性

Question

我正在使用从 jQuery 中选择的内容来添加/隐藏基于先前输入的一些表单数据。我想问一下我如何不能隐藏整个 select 仅基于 id/name 的几个元素。 谢谢你。

基于

 $("#otherField2").chosen() $("#seeAnotherField2").chosen() // This way I can hide all options if nothing is chosen $("#seeAnotherField2").change( function() { if ($(this).val() == "nothing") { $('#otherFieldDiv2').show(); $('#otherField2').attr('required', ''); $('#otherField2').attr('data-error', 'This field is required.'); } else { $('#otherFieldDiv2').hide(); $('#otherField2').removeAttr('required'); $('#otherField2').removeAttr('data-error'); } }); $("#seeAnotherField2").trigger("change");

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js" ></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.css" /> <div class="form-group" id="otherFieldDiv3"> <label for="otherField3">Sev</label> <select class="form-control" id="otherField2"> <option value="nor" id="1">Nor</option> <option value="sev" id="2">Sev</option> <option value="min" id="3">Min</option> </select> </div> Hide only option1 from this: <div class="form-group"> <label for="seeAnotherField2">Options</label> <select class="form-control" id="seeAnotherField2"> <option value="nothing">Nothing</option> <option value="option1">Option1</option> <option value="option2">Option2</option> </select> </div>

Answer 1

尝试这个：

 $("#seeAnotherField2").change(function() { if ($(this).val() == "nothing") { $("#otherField2 option[value='nor']").hide(); $("#otherField2 option[value='sev']").attr('selected','selected'); }else{ $("#otherField2 option[value='nor']").show(); } });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="form-group" id="otherFieldDiv3"> <label for="otherField3">Sev</label> <select class="form-control" id="otherField2"> <option value="nor" id="1">Nor</option> <option value="sev" id="2">Sev</option> <option value="min" id="3">Min</option> </select> </div> Hide only option1 from this: <div class="form-group"> <label for="seeAnotherField2">Options</label> <select class="form-control" id="seeAnotherField2"> <option value="nothing">Nothing</option> <option value="option1">Option1</option> <option value="option2">Option2</option> </select> </div>