duanbing2963
2014-02-12 00:31
浏览 49
已采纳

一旦选中一个类，jQuery禁用复选框

So I have some php code that is spitting out checkboxes for Avatar. However the person can only select one of the images in their gallery to be their avatar. However When they check one of the boxes I want to be able to disable all the others. I can't seem to figure this out. Tried many different things so I thought I would ask with specific code.

echo 'Avatar: <input type="checkbox" name="membersview[]" class="memberavatar" value="'.$galleryid.'" /><br />';

So what I want is if a user checks any checkbox that has a class of members avatar. I would like to disable the other checkboxes that have the class of membersavatar.

Some Sample HTML output so you can see how it is being renedered by the browser

<form action="/members/members_gallery.php" method="post" id="memberdetail">
<div style="width:150px; height:200px; float:left; margin:0; padding:0; border:0;">
    <a href="../site/images/gallery/users/ninja@theringersclan.com/1390202957-20130816_193346.jpg" target="_blank">
        <img src="../site/images/gallery/users/ninja@theringersclan.com/1390202957-20130816_193346.jpg" style="width:150px; height:150px; margin:0; border:0; padding:0;">
    </a> 
    <br>Is Public: <input type="checkbox" name="galleryid[]" value="5">
    <br>Members: <input type="checkbox" name="membersview[]" value="5" checked="checked">
    <br>Avatar: <input type="checkbox" name="membersview[]" class="memberavatar" value="5">
    <br>Delete: <input type="checkbox" name="deletepic[]" value="5">
    <br>
</div>
<div style="width:150px; height:200px; float:left; margin:0; padding:0; border:0;">
    <a href="../site/images/gallery/users/ninja@theringersclan.com/1390203939-240_screenshots_2014-01-19_00001.jpg" target="_blank">
        <img src="../site/images/gallery/users/ninja@theringersclan.com/1390203939-240_screenshots_2014-01-19_00001.jpg" style="width:150px; height:150px; margin:0; border:0; padding:0;">
    </a>
    <br>Is Public: <input type="checkbox" name="galleryid[]" value="7" checked="checked">
    <br>Members: <input type="checkbox" name="membersview[]" value="7" checked="checked">
    <br>Avatar: <input type="checkbox" name="membersview[]" class="memberavatar" value="7">
    <br>Delete: <input type="checkbox" name="deletepic[]" value="7"><br></div><div class="cl">
</div>
<br><br>
<input type="submit" name="galleryupdatepics" value="Update Pics" style="float:left">

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

4条回答 默认 最新

  • duangu1868 2014-02-12 00:37
    最佳回答

    Something like this -

    $function(){
    $('.memberavatar').click(function(){
          $('.memberavatar').not(this).each(function(){
              $(this).prop("disabled", true);
          });
    });
});

    JSFiddle example - http://jsfiddle.net/wzNdL/

    UPDATE
    To mimic a radiogroup, but only after the 1st is 'unchecked', try something like this -

    $(function(){
    $('.memberavatar').click(function(){
        if($(this).is(':checked')){
              $('.memberavatar').not(this).each(function(){
                  $(this).prop("disabled", true);
              });
        }
        else {
              $('.memberavatar').prop("disabled", false);
        }
    });
});

    JSFiddle - http://jsfiddle.net/wzNdL/4/

    评论
    解决 无用
    打赏 举报
查看更多回答(3条)

报告相同问题？

提交

相关推荐 更多相似问题