2

私はjqueryの初心者です（「noob」の場合、「数時間前にjqueryを使い始めました」という意味です）。私がやりたいことは非常に簡単です。チェックボックスがオンになっているときに変数に値を追加し、チェックボックスがオフになっている場合は同じ変数の以前の値を復元します。値は、ドキュメントのスパン内に書き込む必要があります。私が書いたコードには2つの問題があります。

1-チェックボックスをオフにすると値が復元されません。

2-ページを最初に読み込んだときでも、値を常にドキュメントに表示したいのですが、これを行う方法がわかりません（if条件内に記述されているため、最初のクリック後に表示されます）

スクリプトは次のとおりです。何が問題になっていますか？

<script type="text/javascript">
    var pds1=0;
    $(document).ready(function() {
        $("#mat1").click(function() {
            if($('#mat1').is(':checked')) { 
                pds1=pds1+10;
                $('#perk1').html(pds1);
            } 
            else {
                if(pds1>0)
                {
                    pds1=pds1-10;
                }
                else {}
            }
        });
    });
</script>

そしてここにHTMLがあります：

<input id="mat1" type="checkbox" /> <span id="perk1"></span>
4

2 に答える 2

1

チェックされているかどうかにかかわらず、スパンを更新する必要があります。コードは次のようになります。

var pds1 = 0;
$(document).ready(function () {
    $('#perk1').html(pds1);

    $("#mat1").click(function () {
        if ($('#mat1').is(':checked')) 
           pds1 = pds1 + 10;
        else if (pds1 > 0) 
           pds1 = pds1 - 10;
        $('#perk1').html(pds1);
    });
});

jsFiddle： http: //jsfiddle.net/eHasK/2/

于 2012-07-28T18:58:35.733 に答える
1

だから、あなたは2つのことを求めています：

  1. ページが読み込まれたときに変数の初期値を表示します
  2. チェックボックスをオフにすると、更新された値が表示されます。

下記参照：

<script type="text/javascript">
var pds1=0;
$(document).ready(function() {
    $('#perk1').html(pds1); // Display initial value on page load
    $("#mat1").click(function() {
        if($('#mat1').is(':checked')) { 
            pds1=pds1+10;
            $('#perk1').html(pds1);
        } else {
        if(pds1>0)
        {
            pds1=pds1-10;
            $('#perk1').html(pds1); // Display updated value on uncheck
        }
        else {}
        }
    });
});
</script>

Knockoutなどのデータバインディングフレームワークにも興味があるかもしれません。

http://knockoutjs.com/documentation/introduction.html

于 2012-07-28T19:02:29.947 に答える