Question

我在Wordpress中使用带有字段ID的表单构建器。如果更改了特定的单选按钮选项，我需要取消选中一个特定的复选框。单选按钮的字段ID为180.复选框的字段ID为640.这是我首先尝试的内容：

<script type="text/javascript">
jQuery(document).ready(function($){
  $('input[name="item_meta[180]"]').change(function(){
    $('input[name="item_meta[640]"]').val('');
  })
})
</script>

请注意，此脚本最初用于更改下拉列表的值，而不是菜单。我对代码所做的唯一更改是在第3行将“select”更改为“input”。

我也尝试过改变

.val('');

到

.attr('checked', false);

还有

.removeAttr('checked');

这些都不起作用。单选按钮更改后，复选框保持选中状态。有没有人有任何想法？提前谢谢！

更新：以下是HTML中的两个相关表单字段：

<div id="frm_field_180_container" class="frm_form_field form-field  frm_required_field frm_top_container">
    <label  class="frm_primary_label">Pricing Categories
        <span class="frm_required">*</span>
    </label>
    <div class="frm_description">Select your meta-category then locate your entry fee in the subsequent dropdown.</div>
    <div class="frm_radio"><input type="radio" name="item_meta[180]" id="field_180-0" value="Independent Film &amp; Videos"   class="required" onclick="frmCheckDependent(this.value,'180')"/><label for="field_180-0">Independent Film & Videos</label></div>
    <div class="frm_radio"><input type="radio" name="item_meta[180]" id="field_180-1" value="Film / Video for TV &amp; Cable Production"   class="required" onclick="frmCheckDependent(this.value,'180')"/><label for="field_180-1">Film / Video for TV & Cable Production</label></div>
    <div class="frm_radio"><input type="radio" name="item_meta[180]" id="field_180-2" value="TV Ads, PSAs, Screenplays, New Media, Websites, etc."   class="required" onclick="frmCheckDependent(this.value,'180')"/><label for="field_180-2">TV Ads, PSAs, Screenplays, New Media, Websites, etc.</label></div>
    <div class="frm_radio"><input type="radio" name="item_meta[180]" id="field_180-3" value="Student Entry of Any Category (with 2 Additional Categories Free) - $45"   class="required" onclick="frmCheckDependent(this.value,'180')"/><label for="field_180-3">Student Entry of Any Category (with 2 Additional Categories Free) - $45</label></div>
</div>

和

<div id="frm_field_640_container" class="frm_form_field form-field  frm_top_container frm_last_third">
    <label class="frm_primary_label">Apply Early-Bird Discount
        <span class="frm_required"></span>
    </label>
    <div class="frm_opt_container"><div class="frm_checkbox" id="frm_checkbox_640-0"><input type="checkbox" name="item_meta[640][]" id="field_640-0" value="5"  /><label for="field_640-0">1-3 Categories: $5</label></div>
</div>

Answer 1

以下方法似乎有效：

$('input[name="item_meta\\[180\\]"]').change(function(){
    $('input[name="item_meta\\[640\\]\\[\\]"]').prop('checked',false);
});

JS Fiddle demo

请注意，我删除了onclick（因为它们没有定义，它们的缺失会产生错误，如果你使用jQuery 为什么你甚至使用内联事件 - 处理程序？）。此外，方括号的转义（使用\\字符）。

参考文献：

prop()。

Answer 2

您的HTML和JQuery之间的复选框名称不匹配。。

<强> HTML

<input type="checkbox" name="item_meta[640][]" id="field_640-0" value="5"  />

此处，name属性为item_meta[640][]。

<强> JS

$('input[name="item_meta[640]"]').val('');

此处，name属性为item_meta[640]。

因此，选择器与复选框不匹配。如果您将JQuery选择器更新为$('input[name="item_meta[640][]"]')，它应该可以正常工作。

如Dave Thomas所述，你最好选择.prop('checked', false);来取消选中此框。

更改单选按钮选择时清除复选框

2 个答案: