4

フォルダーの内容を読み取るループに次のコードがあります。

<div class="oddrow">
    <span class="title">1 - 1215 - Magna Carta</span><br/>
    <span class="size">size: 229.1 MB</span>
    <input name="1215 - Magna Carta" type="checkbox">
<div>

チェックボックスがチェックされたら、各レコードのサイズを個別の div に追加したいと思います。

<div id="total>total = </div>

これどうやってするの?

4

4 に答える 4

4

シェーンが言ったように、単純な数値を属性に保存する方がよいでしょう。それが可能でない場合でも、次のようにすることができます。

$(':checkbox:checked').each(function(){
    sum += parseFloat($(this).prev().text().match(/[\d\.]+/));
});

デモ:

http://jsfiddle.net/bGjP4/

チェックボックスに値として保存する方法は次のとおりです。

$(':checkbox:checked').each(function(){
    sum += parseFloat($(this).val());
});
于 2012-07-31T16:24:54.057 に答える
3

HTML を調整できる場合は、サイズ スパンまたはチェックボックスのデータ属性にサイズ値を入れることをお勧めします。これにより、jqueryの合計計算がはるかに簡単になります...

<input name="..." type="checkbox" data-size="229.1" class="checkTotal" />

次に、jquery は次のようになります。

$(function() {

    var total = 0;
    $(".checkTotal:checked").each(function(idx, elem) {
         total = total + parseFloat($(elem).data('size'));
    });
    $('#total').text('total = ' + total);

});
于 2012-07-31T16:22:27.437 に答える
0

あなたの質問はjQueryでタグ付けされているので、jQueryを使用していると思います。

このような div がある場合 (追加したいくつかのクラスに注意してください):

<div class="oddrow rows_to_add">
    <span class="title">1 - 1215 - Magna Carta</span><br/>
    <span class="size">size: <span class="size">229.1</span> MB</span>
    <input name="1215 - Magna Carta" class="add_when_checked" type="checkbox">
<div>
<div class="evenrow rows_to_add">
    <span class="title">1 - 1215 - Magna Carta</span><br/>
    <span class="size">size: <span class="size">229.1</span> MB</span>
    <input name="1215 - Magna Carta" class="add_when_checked" type="checkbox">
<div>

そして総div:

<div id="total>total = <span id="total"></span></div>

それらを合計するjQueryコード:

$( '.add_when_checked' ).change( function() {
   var total = 0;
   $( '.rows_to_add' ).each( function() {
      var $this = $( this );
      if ( $this.find( '.add_when_checked' ).attr( 'checked' ) ) {
         total += $this.find( '.size' ).html();
      }
   } );
   $( '#total' ).html( total );
} );

基本的にこれは、チェックボックスの状態が変化すると、クラス「rows_to_add」ですべてのdivを循環し、クラス「add_when_checked」で含まれているチェックボックスがいつチェックされるかを確認し、そうであれば、クラス「サイズ」でスパン内に値を追加します合計に。合計を取得したら、それを id "total" の div に配置します。

別の方法としては、次のようなものがあります。

$( '.add_when_checked' ).change( function() {
   var total = 0;
   $( '.add_when_checked:checked' ).each( function() {
      total += $( this ).parent().find( '.size' ).html();
   } );
   $( '#total' ).html( total );
} );

セレクターを使用して、条件の代わりにチェックされているチェックボックスを見つけ、次に親トラバーサルを使用して関連するサイズスパンを見つけます。

于 2012-07-31T16:32:37.080 に答える
0
$(document).ready(function(){
    $("input[type='checkbox']").on('change', function(){
        var sum = 0;
        $("input[type='checkbox']:checked").each( 
            function() { 
               sum += $(this).siblings('.size').text().split(' ')[1];
            } 
        );
        $('#total').text('total = ' + sum);
    })
});
于 2012-07-31T16:31:53.977 に答える