关于使用复杂名称定位输入的问题

时间:2018-02-08 07:23:59

标签: javascript jquery

我有一组像这样的复选框

  <li id="apptax-15">
    <label class="selectit">
      <input value="15" type="checkbox" name="tax_input[apptax][]" id="in-apptax-15"> No</label>
  </li>
由WordPress API生成的

现在我需要通过它的名称属性选择chech box,如下所示,但是我收到此错误

  

语法错误,无法识别的表达式:   输入:复选框[名称= tax_input [apptax] []]

你可以告诉我如何解决这个问题

$('input:radio[name=r3]').on('change', function() {
  $('input:checkbox[name=tax_input[apptax][]]').removeAttr('checked');
  console.log('changes happend')

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="" data-wp-lists="list:" class=" form-no-clear">

  <li id="apptax-15">
    <label class="selectit">
      <input value="15" type="checkbox" name="tax_input[apptax][]" id="in-apptax-15"> No</label>
  </li>

  <li id="apptax-17">
    <label class="selectit">
      <input value="17" type="checkbox" name="tax_input[apptax][]" id="in-apptax-17"> Maybe</label>
  </li>

  <li id="apptax-16">
    <label class="selectit">
      <input value="16" type="checkbox" name="tax_input[apptax][]" id="in-apptax-16"> Yes</label>
  </li>
</ul>


<div class="panel-body">

  <label class="checkboxer">
    <input type="radio" name="r3" value="15"> No</label>
  <label class="checkboxer">
    <input type="radio" name="r3" value="17"> Maybe</label>
  <label class="checkboxer">
    <input type="radio" name="r3" value="16"> Yes</label>
</div>

4 个答案:

答案 0 :(得分:2)

你需要像这样转义括号:

$('input:checkbox[name=tax_input\\[apptax\\]\\[\\]]').removeAttr('checked');

参见工作jsfiddle: https://jsfiddle.net/8hw051vu/

答案 1 :(得分:1)

有些角色在css选择器上运行良好。如果您无法使用它们,那么使用id(如果它是唯一元素)或创建class(如果它们预计会很多)。

如果您赶时间使用@Ingal S. solution

答案 2 :(得分:1)

您可以将""括起来,如$('input:checkbox[name="tax_input[apptax][]"]')

&#13;
&#13;
$(document).ready(function(){
	$('input:checkbox[name="tax_input[apptax][]"]').removeAttr('checked');
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input value="15" type="checkbox" name="tax_input[apptax][]" id="in-apptax-15" checked/> No
&#13;
&#13;
&#13;

答案 3 :(得分:0)

  1. 选中复选框,按单选按钮的值为复选框值。
  2. &#13;
    &#13;
    $('input:radio[name=r3]').on('change', function() {
    
    var value = $(this).val()
      $('input:checkbox[value='+value+']').removeAttr('checked');
      console.log('changes happend')
    
    });
    &#13;
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <ul id="" data-wp-lists="list:" class=" form-no-clear">
    
      <li id="apptax-15">
        <label class="selectit">
          <input value="15" type="checkbox" name="tax_input[apptax][]" id="in-apptax-15"> No</label>
      </li>
    
      <li id="apptax-17">
        <label class="selectit">
          <input value="17" type="checkbox" name="tax_input[apptax][]" id="in-apptax-17"> Maybe</label>
      </li>
    
      <li id="apptax-16">
        <label class="selectit">
          <input value="16" type="checkbox" name="tax_input[apptax][]" id="in-apptax-16"> Yes</label>
      </li>
    </ul>
    
    
    <div class="panel-body">
    
      <label class="checkboxer">
        <input type="radio" name="r3" value="15"> No</label>
      <label class="checkboxer">
        <input type="radio" name="r3" value="17"> Maybe</label>
      <label class="checkboxer">
        <input type="radio" name="r3" value="16"> Yes</label>
    </div>
    &#13;
    &#13;
    &#13;