0

こんな小さな計算ページを作りたい

1000 X _ = 
 500 X _ = 
   Total =

私がやりたいのは、誰かが「_」に数値を入力すると、自動的に乗算と合計を表示することです。

<div>
    <div> 
        <span class="value">1000</span> X
        <input type="text" size="4" class="inputdata"/> = 
        <span class="multiplydate"></span>
    </div>
    <div>
        <span class="value">500</span> X
        <input type="text" size="4" class="inputdata" /> = 
        <span class="multiplydate"></span>
    </div>
    <div>
        TOTAL = 
        <span class="totaldata"></span>
    </div>
</div>

次に、jquery を使用して計算を行います。

$('.inputdata').live('onChange', function () {
    $(this).closest('.multiplydata').html(
        $(this).closest('.value').html() *         
            $(this).closest('.inputdata').val()
    );
});

コードの何が問題なのですか?? 何も起こっていないようです。

4

2 に答える 2

3

liveは次のように置き換えられましon た:

$('.inputdata').on('onChange',function(){ 
       $(this).closest('.multiplydata')
       .html($(this).closest('.value')
       .html()*$(this).closest('.inputdata').val());
 });
于 2013-03-05T17:23:09.107 に答える
1

変更点:

  • onchangeに置き換えられましたkeyup
  • $('.multiplydata')はNextテキストボックスなので、に変更ClosestしますNext

フィドルの例: http://jsfiddle.net/RYh7U/113/

Jクエリ：

$('.inputdata').live('keyup', function () {
    var SpanData = $(this).closest(":has(.value)").find('.value').html();
    var Result = $(this).next(".multiplydate");
    Result.html(SpanData * $(this).val());  

    //Total Part
    var sum=0;
    $('.multiplydate').each(function() {
        sum += Number($(this).html());        
    });
    $(".totaldata").html(sum);
});
于 2013-03-05T18:07:28.900 に答える