-1

javascriptが予期しない方法で変数'i'を使用するため、初心者の問題のようなものがあります。

for(var i=0; i<3;i++){
    $("a[href=#markers"+i+"]").click(function() {
        console.info(this);
        console.info("click: "+i);
    });
}

これが私のコンソールです：

<a href="#markers0">
click: 3
<a href="#markers1">
click: 3
<a href="#markers1">
click: 3

しかし、私はこれが欲しい：

<a href="#markers0">
click: 0
<a href="#markers1">
click: 1
<a href="#markers1">
click: 2

誰かがこの問題を助けて解決できますか？ありがとう！

4

3 に答える 3

0

ループは、クリックした内容に関係なく、変数を増やし続けiます。

で始まるhrefを持つすべての要素をターゲットにして#markers、次のようにhrefから番号を取得しないのはなぜですか。

$('a[href^="#markers"]').on('click', function() {
     var i = $(this).attr('href').replace('#markers','');
     console.log("click: "+i);
});​

フィドル

または、なんらかの奇妙な理由でループが必要な場合は、いつでも変数をdata（）に格納できます。

for(var i=0; i<3;i++){
    $("a[href=#markers"+i+"]").data('i',i).click(function() {
        console.info(this);
        console.info("click: "+$(this).data('i'));
    });
}​

フィドル

于 2012-10-28T18:19:52.820 に答える
0

これはクロージャの助けを借りて解決できます。あなたの場合、クリックイベントは変数iで割り当てられています。しかし、リンクをクリックするまでに、すべてが同じメモリを指しているため、iの値は3に設定されます。位置..

クロージャを使用すると、関数がiの現在の値に対して実行されるため、ここで問題が解決されます。これを試してください

for(var i=0; i<3;i++){
  (function(num){
       return  $("a[href=#markers"+num+"]").click(function() {
                  console.info(this);
                  console.info("click: "+num);
               });
   })(i)
}

フィドルを確認してください

于 2012-10-28T18:35:38.997 に答える
0

リンクごとに個別のクリック時ハンドラーを作成したり、各リンクを個別に選択したりする必要はありません。
また、他の回答は、事前定義されたリンクのセット（0..2）でのみ機能します。
私のバージョンは、単一のセレクターと単一のハンドラーを使用し、任意の数のリンクで機能します。
それらの間に穴があっても。

// all of the #markers* href elements
var links = $("a[href^=#markers]");

// common click handler
links.click(function () {
    // get the number from the href
    var num = parseInt($(this).attr("href").substr(8), 10);    
    console.log("click", num);
});

ここでフィドルをデモンストレーションします。

于 2013-12-21T00:43:34.170 に答える