1

ボタンのクリックで値をインクリメントしようとしています。ボタンが1つしかない場合は簡単ですが、ボタンが複数ある場合にカウントを追跡する方法がわかりません。ページを読み込む前に、追跡する必要のあるボタンの数がわからないため、これはさらに難しいようです。最終的な目標は、1つのページに複数のAJAXページ付けスキームを構築することです（データベースから古いリストアイテムを順番にロードし、クリックされたアイテムに固有のものにします）。

これがJSFiddleです（以下はそのJSとHTMLです）私はこれを手に入れ始めました：http：//jsfiddle.net/trpeters1/menAX/6/

JS：

var cnt=function(id){ //this code is incomplete but hopefully you'll get the idea of what i'm trying to do...
var j=0;
for(var i=0; i>100; i++){
    if(id[i]==i) j+=5;
}
    return j;
};

$('button').click(function(){  
   var id=this.id;
   var c=cnt(id); //something which will return the current increment value of the button that was clicked 
   $('#'+id+'div').append(c+'message'+id+'<br>');
});​

HTML：

<button type="button" id="btn1">1</button><div id="btn1div"></div>
<button type="button" id="btn2">2</button><div id="btn2div"></div>
<button type="button" id="btn3">3</button><div id="btn3div"></div>

このコードの問題は、各ボタンをクリックすると同じメッセージが出力されることです。理想的には、コードはクリックされた各ボタンを追跡できるはずです。これが機能する可能性があると私が考えていた方法は、各ボタンidを独自のカウンターに結び付けることでした（おそらく複数のjカウンターが必要でしょうか？）。

考え？

4

3 に答える 3

3

.data()jQueryのメソッドを使用して、各ボタンに対するカウンターを保存できます。

$('button').click(function(){

    var $this = $(this),
        c = $this.data('count'); // get count for current button
    if (!c) c = 0;               // if not defined yet set to 0
    c++;                         // increment count
    $this.data('count',c);       // save updated count

    // Do something with c here
});

デモ： http： //jsfiddle.net/menAX/8/

于 2012-10-26T01:25:25.067 に答える
1

このようなもの？

$('button').click(function() {
    var $elem = $('#'+ this.id +'div');
    var c = $elem.children().length;
    $elem.append(c + 'message' + id + '<br>');
});

http://jsfiddle.net/hZHW3/

于 2012-10-26T00:56:41.897 に答える
1

同じ質問をする可能性のある人々のためにここで繰り返します、これが私が問題を解決した方法です。これは、Javascriptでは辞書/マップ/ハッシュテーブルのように機能する匿名オブジェクトの使用に依存しています。ボタンを最初に押したとき、プロパティは存在しないため、1に初期化され、その後、インクリメントされます。

これは私のために働きます：

<html>
<head>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
var counter = {};
$(function() {

    $('button').click(function(){  
        var id=this.id;
        if (counter.hasOwnProperty(id)) {
            counter[id] += 1;
        } else {
            counter[id] = 1;
        }
        var c= counter[id];
        $('#'+id+'div').append(c+' message '+id+'<br>');
    });
});
</script>
</head>
<body>
<button type="button" id="btn1">1</button><div id="btn1div"></div>
<button type="button" id="btn2">2</button><div id="btn2div"></div>
<button type="button" id="btn3">3</button><div id="btn3div"></div>
</body>
</html>
于 2012-10-26T01:40:45.107 に答える