1

jQuery.ajax を使用して、XML ファイルを読み取って HTML にレンダリングしています。

次のコードは、XML の各データ レコードのボタンのテーブルを生成します。

$(xml).children('run').each(function() {
    var runname = $(this).children('name').text();

    buttonHtml = '<tr><td class="expbutton" id="runExpButton" onmousedown="myFunc(runname)">Click me</td></tr>';

    $('#Runs').append(buttonHtml);
});​

ここで何を達成したいのかを理解するのは難しくありません。しかし、明らかにそれは機能しません。

私の質問は、jQuery でこれを達成するにはどうすればよいですか? .live または .on メソッドを使用すると、「runname」などのローカル変数にアクセスできません。

[編集]

jQuery.data() の使用を試みます:

$(xml).children('run').each(function() {
    var runname = $(this).children('name').text();

    buttonHtml = '<tr><td class="expbutton" id="runExpButton" onmousedown="myFunc(runname)">Click me</td></tr>';
    $('#runExpButton').data('runname', runname);
    $('#Runs').append(buttonHtml);
});​

$('#runExpButton').live('click',function() {
    alert($(this).data("runname"));
});

うまくいかないようですか？ボタンの 1 つだけが正しいデータ値を持っています。

すべてのボタンが同じ ID を持っているため、.data() はこれで動作しないのではないでしょうか?

4

2 に答える 2

2

あなたが探していると私が信じているのは jQuery .data()です

html 要素のデータを保存し、要素がクリックされたときにそのデータを取得できます。

例は

$(xml).children('run').each(function(index) {
    var runname = $(this).children('name').text();
    buttonHtml = '<tr><td class="expbutton" id="runExpButton'+index+'">Click me</td></tr>';
    $('#Runs').append(buttonHtml);
    $('#runExpButton'+index).data('runname', runname);
});​

$(document).on('click', '.expbutton', function(){
     alert($(this).data('runname'));
});

コードを編集して、テーブルに追加する各セルに一意の ID を追加しました。

于 2012-12-21T04:12:41.123 に答える
0

HTMLを次のように変更できます

buttonHtml = '<tr><td class="expbutton" id="runExpButton" data-name="' + runname + '">Click me</td></tr>';

次に、ブレイクが正しく述べたように、 $(element).data('name') を使用してその値を取得します。そのため、イベントを .live でバインドし、データ名を読み取り、利益を得ます!

于 2012-12-21T04:25:42.663 に答える