使用jquery或javascript在2个复选框之间切换

时间:2013-06-28 19:42:12

标签: javascript jquery .net

我在使用jquery在2个复选框之间切换时遇到了困难。目前这就是我所拥有的。

<div id="chkBoxList"  onclick="CheckBoxToggle()">
  <font size="2">
 <input type="checkbox"  class="all" name="empType" id="empType1" value="BWR is a Full Time employee. " checked="checked"  disabled="disabled"/>
  Full Time
 <input type="checkbox" class="all"  name="empType"  id="empType2" value="BWR is a Part Time employee. " /> Part Time
 </font>
 </div>

jquery就这样了。

function CheckBoxToggle() {


$('#chkBoxList').click(function () {
    var $checkbox = $(this).find(':checkbox');
    $checkbox.prop('checked', !$checkbox[0].checked);
    $checkbox[1].checked;
    $checkbox.trigger('change');
});



}

但这要么切换到选中或未选中。因为,检查和禁用了一个的初始值,当点击第二个时我想要检查和禁用其他值,而第一个将被取消选中并禁用。任何帮助表示赞赏。

3 个答案:

答案 0 :(得分:2)

<html>
<body>  
<form name=f1 id=f1>
<input type=checkbox name=chk1 id=chk1 onclick=javascript:document.f1.chk2.checked=!document.f1.chk1.checked;> Check 1<BR>
<input type=checkbox name=chk2 id=chk2 onclick=javascript:document.f1.chk1.checked=!document.f1.chk2.checked;> Check 2<BR>
</form>
</body>
</html>

答案 1 :(得分:0)

$('input.all').click(function(e){

    $('input.all').prop('checked', false).prop('disabled',false) ;
    $(this).prop('checked', true).prop('disabled', true) ;


}) ;

答案 2 :(得分:0)

您需要使用.each()循环$ checkbox。

$(function(){
    $('#chkBoxList').click(function () {
    var $checkbox = $(this).find(':checkbox');

    $checkbox.each(function(){
       $(this).prop('checked', !$checkbox[0].checked);
        });


    });
});

http://jsfiddle.net/mPstq/1/