0

私は SO で同様の質問をたくさん読みましたが、この質問が多く寄せられていることを理解しています。無効にする部分があり、正しく動作します。ただし、いずれかのグループからチェックボックスのチェックを外し始めると、すべてが元に戻されます。基本的に、いずれかのグループのチェックボックスをクリックすると、他のグループが無効になります。

これは私のHTMLです

<tr>
    <td><input type="checkbox" class="printgroup"></td>
    <td><input type="checkbox" class="downgroup"></td>
</tr>
<tr>
    <td><input type="checkbox" class="printgroup"></td>
    <td><input type="checkbox" class="downgroup"></td>
</tr>
<tr>
    <td><input type="checkbox" class="printgroup"></td>
    <td><input type="checkbox" class="downgroup"></td>
</tr>
<tr>
    <td><input type="checkbox" class="printgroup"></td>
    <td><input type="checkbox" class="downgroup"></td>
</tr>

そして、これは他のグループのいずれかを無効にする JS です。私は JS が最も美しいわけではないことを知っています。

$(function(){
  $(".printgroup").click ( function() {
    if ( !$(this).is ( ":checked" ) )
    {
        $(".downgroup").removeAttr ( "disabled" );
        $('#printdown').attr('value', 'Go');
    }       
    else{
      $(".downgroup").attr ( "disabled" , true );
      $('#printdown').attr('value', 'Print');
    }
  });
});

$(function(){
  $(".downgroup").click ( function() {
    if ( !$(this).is ( ":checked" ) )
    {
        $(".printgroup").removeAttr ( "disabled" );
        $('#printdown').attr('value', 'Go');
    }       
    else{
      $(".printgroup").attr ( "disabled" , true );
      $('#printdown').attr('value', 'Download');
    }
  });
});

ここでフィドル。

編集：もっと辛抱するべきでした。投稿してから数分後に問題を解決しました。

に置き換えたところですが!$(this).is ( ":checked" )、!$('.downgroup').is ( ":checked" )2 番目の部分が残っています。では、JS を効率的にしますか? 私は今2つの機能を持っています。それらを1つに減らすことはできますか？

4

1 に答える 1

1

はい、どちらも同じことを行うため、それらを一緒に溶かすことができます. グループだけが違う。http://jsfiddle.net/wQfKz/2/を参照してください。

$(".printgroup, .downgroup").on("click", function() {
    var isPrintGroup = $(this).is(".printgroup");
    var anyChecked = $(isPrintGroup ? ".printgroup" : ".downgroup").is(":checked");

    // disable other group depending on whether the current group has anything checked
    $(isPrintGroup ? ".downgroup" : ".printgroup").prop("disabled", anyChecked);

    if(!anyChecked) {
        $("#printdown").val("Go");
    } else {
        $("#printdown").val(isPrintGroup ? "Print" : "Download");
    }
});
于 2012-08-22T11:25:39.103 に答える