2

ユーザーが入力できるデフォルトの4行のテーブルがあります。こちらのフィドルを参照してくださいhttp://jsfiddle.net/xaKXM/4/ ユーザーが「 」をクリックすると、テーブルは一意の ID と を含むAdd More新しい行を「 」に追加します。labelTable"configtableTable"

var displaymore = '<tr id=row'+currentIndex+'><td style="text-align: center">'+currentIndex+'</td>'+
    '<td width="60%"><p id="label_row_'+currentIndex+'"></p></td>'+
    '<td><button type="button" class="switch" id="switch_'+currentIndex+'"data-role="button" data-transition="fade">Activate</button></td></tr>';

[送信] ボタンを押すと、説明とActivate[ ] ボタンが に表示されますconfigtableTable。Activateボタンが便利であることを確認するためthisIndexに、段落に追加します#ptest。最初の 4 つの既定の行では機能しますが、新しく追加された行 (5 つ以降) では機能しません。ロジックとコードの何が問題になっていますか?

解決済み: クラス " switch" を作成して使用することにより.on()

 $("#configtableTable").on('click', ".switch", function () {
        thisIndex= $('td:nth(0)',$(this).closest('tr')).text();
        if(thisIndex == ""){thisIndex = 0;}
        $('#ptest').append(thisIndex);
        $.post('/request', {responseNumber:$('#number_'+thisIndex).val(), key_pressed:"activate"});
    });
4

1 に答える 1

0

2つのエラーがあります

1.「addmore」の生成コードでは、ボタンのコードは次のようになります。

id="switch_' + currentIndex + '"

2.新しいボタンを作成したら、クリック イベントを追加する必要があります。次のコードを提案します

$('#configsubmit').click(function () {

for (var x = 1; x <= currentIndex; x++) {
    $('#label_row_' + x).html($('#label_' + x).val());
}
$('#configtable').show();
$("#configeditdiv").show();
$('#labels').hide();

$("#configtableTable [id^='switch_']:button").unbind('click');
$("#configtableTable [id^='switch_']:button").click(function () {        
    thisIndex = $('td:nth(0)', $(this).closest('tr')).text();
    if (thisIndex === "") {
        thisIndex = 0;
    }
    $('#ptest').append(thisIndex);
    $.post('/request', {
    responseNumber: $('#number_' + thisIndex).val(),
    key_pressed: "activate"
    });
});
于 2013-05-13T07:18:33.997 に答える