0

ユーザーがチェックボックスをクリックすると、カウンター #counter +1 は問題ありませんが、チェックを外すと、同じチェックボックスに対して -1 になりません。特定のチェックボックスをクリックしたときと-1のチェックを外したときに+1したい。

--JS--

$('.CheckBox').toggle(function(){
    $('#Counter').html('( '+i+' Selected )');
    i++;
}, function() {

    $('#Counter').html('( '+i+' Selected )');
    i--;
});

---PHP--- 

do { ?>

<div style="position:relative; width:100%; height:20px; background-color:#FF5300;" class="CheckBox" id="<?php echo $row_EX['x1']; ?>">

<input type="checkbox" name="<?php echo $row_EX['x2']; ?>" value="<?php echo $row_EX['x3']; ?>" style="cursor:pointer; ">

<span style="position:relative; top:-2px; font-family:arial; color:#000; font-size:12px;"><?php echo $row_EX['lx4']; ?></span>

</div>

<div style="height:1px; width:1px;"></div>
<?php } while ($row_EX = mysql_fetch_assoc($EY)); ?>    

<span style="position:relative; left:10px; top:6px; font-family:arial; font-size:16px;" id="counter">(0 Selected)</span>
4

5 に答える 5

3

別のアプローチを試してください:

$('.CheckBox').change(function(){

  var n_checkboxes_checked = $('.CheckBox:checked').length;
  $('#Counter').html(n_checkboxes_checked + ' Selected');
});
于 2012-04-12T09:31:00.117 に答える
3 
$('.CheckBox').change(function() {
  if (this.checked) {
    i++;
  } else {
    i--;
  }
  $('#Counter').html('( '+i+' Selected )');
});

var i = 0;ページの読み込み時に必ず初期化してください。

于 2012-04-12T09:31:09.460 に答える
0

jsFiddle demo: http://jsfiddle.net/ENxnK/2

Use change(), not toggle()

var i = 0;
$('.CheckBox').change(function() {
    if ( $(this).attr('checked') ) {
        i++;
    } else {
        i--;
    }

    $('#Counter').html('( ' + i + ' Selected )');
});

​</p>

于 2012-04-12T09:33:52.563 に答える
0

ここでチェックボックスのクリックを処理するコードはありません。.togglejquery では、要素の非表示/表示を処理するだけです。

更新。他の人が提案したように、すべての.checkbox要素を調べる必要はないと思います..グローバル変数は必要ありませんi。代わりに次のようなもの

$('.CheckBox input').click(function(){
    $('#Counter').html('( '+$('.CheckBox input:checked').length()+' Selected )');
}
于 2012-04-12T09:29:57.627 に答える
0

jQueryのドキュメントには....と書かれています。

    Description: Bind two or more handlers to the matched elements, to be executed on alternate clicks.

.toggle( handler(eventObject), handler(eventObject) [, handler(eventObject)] )
handler(eventObject)A function to execute every even time the element is clicked.
handler(eventObject)A function to execute every odd time the element is clicked.

したがって、チェック/チェック解除とは関係ありません

こうやって

$('.CheckBox').click(function(){
    if($(this).attr('checked')){
        $('#Counter').html('( '+i+' Selected )');
        i++;
    }else{
        $('#Counter').html('( '+i+' Selected )');
        i--;    
    }
}

はい、トグルの代わりにクリックします...私はそれを逃しました、そしてあなたは代わりにattrを使用します

于 2012-04-12T09:30:54.357 に答える