1

次の jQuery Javascript コードは、空のページに含まれています。

var element;
$(function() {
  for (var i = 0; i < 10; i++) {
    element = $('<div>' + i + '</div>');
    element.click(function() {
      alert(i);
    });
    $('body').append(element);
  }
});

望ましい動作は、このコードが 0 から 9 までの番号が付けられた 10 個の div 要素を生成することです。div 要素をクリックすると、クリックした div 要素の番号がアラート ポップアップに表示されます (つまり、ユーザーが div 要素をクリックした場合)。ラベルが「4」の場合、アラート ポップアップには数字の 4 が表示されます)。

アラート ポップアップには、クリックされた div 要素に関係なく、代わりに数字の 10 が表示されます。

このコードを変更して、目的の方法で動作させるにはどうすればよいですか?

4

3 に答える 3

4

変数を関数パラメーターとして渡す必要があります。

例えば：

function buildElement(i) {
    var element = $('<div>' + i + '</div>');
    element.click(function() {
        alert(i);
    });
    $('body').append(element);
}

$(function() {
    for (var i = 0; i < 10; i++) {
        buildElement(i);
    }
});

次のように、インライン匿名関数を使用してこれを行うこともできます。

$(function() {
    for (var i = 0; i < 10; i++) {
        (function(i) {
            var element = $('<div>' + i + '</div>');
            element.click(function() {
                alert(i);
            });
            $('body').append(element);
        })(i);
    }
});
于 2010-05-07T19:57:10.217 に答える
0

通常、私は番号をIDに隠し、構造化された方法でそれを取得します:

$(function() {
    for (var i = 0; i < 10; i++) {
        element = $('<div id="id-'+i+'">' + i + '</div>');
        element.click(function() {
            alert($(this).attr('id').split('-')[1]);
        });
        $('body').append(element);
    }
});
于 2010-05-07T20:00:18.907 に答える
0

2 つのうちの 1 つを行うことができます。div の内容を使用して is を出力したり、セレクターから配列内のインデックスを取得したりできます。

これは内容の例です:

element.click(function() {
  alert($(this).text());
});

またはインデックスの場合：

element.click(function() {
  alert($('div').index(this));
});

私は両方がうまくいくと信じています

于 2010-05-07T20:00:38.890 に答える