jQuery - Checkbox Checked

时间:2016-09-19 09:37:59

标签: javascript jquery checkbox

prop("checked", false)重置复选框上的<option>值吗?例如:

<input type="checkbox" name="price_range" value="1" id="ceo"> < $10,000
<input type="checkbox" name="price_range" value="2" id="bod"> < $ 200,000.00

如果我有两个复选框,当我点击id=ceo时,我点击id=bod它会覆盖复选框的值。我可以使用以下编码来获取值:

if ($('#ceo').is(":checked"))
{
    //if ceo is check           
} 
else if ($('#bod').is(":checked")) 
{
    //if bod is check
} 
else 
{
   //set prop("checked", false)
}

5 个答案:

答案 0 :(得分:2)

只需在jquery中使用属性selctor

$("input[name='price_range']").click(function() {
  $("input[name='price_range']").removeProp('checked');
  $(this).prop('checked', true);
  console.log(this.value);
});

答案 1 :(得分:2)

.prop("checked", false)未选中复选框。就是这样。它对复选框的value没有影响(如果你的意思是&#34;&lt; option&gt; value&#34;)。

听起来好像你的复选框应该是单选按钮,因为用户不希望复选框的行为类似于单选按钮,并且令人惊讶的是会导致用户体验不佳。

但是,如果重要的是它们是复选框,但也是互相排斥的,那么您可以通过搜索具有相同名称的其他人并取消选中它们来实现它:

$("input[name=price_range]").on("click", function() {
  if (this.checked) {
    $("input[name=" + this.name + "]").not(this).prop("checked", false);
  }
});

示例:

&#13;
&#13;
$("input[name=price_range]").on("click", function() {
  if (this.checked) {
    $("input[name=" + this.name + "]").not(this).prop("checked", false);
  }
});
&#13;
<label>
  <input type="checkbox" name="price_range" value="1" id="ceo">&lt; $10,000</label>
<label>
  <input type="checkbox" name="price_range" value="2" id="bod">&gt; $ 200,000.00</label>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;
&#13;
&#13;

(另请参阅代码段中使用label。)

答案 2 :(得分:0)

我想你想在任何时候最多检查一个复选框,对吧?如果是这种情况,您可以签出radio输入。

答案 3 :(得分:0)

您应该使用单选按钮而不是此处的复选框

(.*?)_(.*?)_.*_(INS|UPD|DEL|UPSERT)$    -- CORRECT
^Schedule_(.a*)                         -- CORRECT
(IP(.*?)_(.*?)_.*_(INS|UPD|DEL|UPSERT)$ -- WRONG

如果要选择多个值,则应使用复选框。但是,如果您希望使用复选框

来实现它

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" name="price_range" value="1" id="ceo"> 
<input type="radio" name="price_range" value="2" id="bod">
$('input:checkbox').click(function() {
    $('input:checkbox').not(this).prop('checked', false);
});  

答案 4 :(得分:0)

$("input[name=price_range]").on("click", function() {
    if (this.checked && this.id === 'ceo') {
        // do code for ceo
    }
    else if (this.checked && this.id === 'bod') {
            //do code for bod;
    }
    else{
       //do code;
    }
});