当用户在多检查框中选中一个时,如何禁用一个复选框

时间:2012-06-16 15:34:11

标签: php jquery

我有两个生成的复选框:

  <table>
    <?php foreach ($invited_members as $mem) : ?>
        <?php if ($mem['mc_role'] != 'c') : ?>
                            <tr>
                                <td style="width:40px;text-align:center"> attend  </td>
                             <td style="width:40px;text-align:center"><input name="p_members[]" id="p_members" type="checkbox"  value="<?php echo $mem['member_id']; ?>" <?php if ($mem['mm_present'] == 1) echo 'checked="checked"'; ?> <?php if (!$this->isSupervisor or $meeting_info['meeting_status'] != 2) echo 'disabled="disabled"';?> onclick="change(this,'#on_p_members');"/></td>
                              <td style="width:40px;text-align:center"> E-attend  </td>
                                <td style="width:40px;text-align:center"><input name="on_p_members[]" id="on_p_members" type="checkbox" value="<?php echo $mem['member_id']; ?>" <?php if ($mem['mm_present'] == 2) echo 'checked="checked"'; ?> <?php if (!$this->isSupervisor or $meeting_info['meeting_status'] != 2) echo 'disabled="disabled"'; ?>onclick="change(this,'#p_members');"/></td>
                                <td style="width:50px;text-align:center"><img src="<?php echo base_url() . 'avaters/' . $mem['mem_image']; ?>" height="38" width="38" /></td>
                                <td><?php echo stripslashes($mem['mem_real_name']); ?></td>
                            </tr>
        <?php endif; ?>
    <?php endforeach; ?>
                </table>

我希望当用户检查其中一个时禁用另一个,所以我厌倦了使用jquery

function change(p_members,x)
{


 if ($(p_members).attr('checked'))
     { 

         $(x).attr('checked',false);
         $(x).attr('disabled',true);

     }
     else 
         {               
              $(x).removeAttr('disabled');

         }
  }

但它无法正常工作。当第二行中的用户选中一个复选框时,该行之前的一个复选框被禁用。我该如何解决这个问题?

2 个答案:

答案 0 :(得分:1)

你可以试试这个......

 $("input:checkbox").click(function () {
    $("input:checkbox").not($(this)).attr('disabled', 'disabled');
});

这是一般形式。你可以添加元素或id的父级来获得所需的复选框列表。

答案 1 :(得分:0)

这应该在任何版本的jQuery上执行:

HTML

<input type="checkbox" id="p_members" />
<input type="checkbox" id="on_p_members" />

的JavaScript

$('#p_members').change(function() {
    if($(this).is(":checked")) {
        $('#on_p_members').attr('disabled', 'disabled');
    } else {
        $('#on_p_members').removeAttr('disabled');
    }
});

看看这个jsFiddle,看看它在行动: http://jsfiddle.net/s3pRy/