1

奇妙で断続的な問題は、すべてのコードなしでは解決するのが難しいですが、次のようになります (私は必死になっています):

Datatables を使用する HTML テーブルがあります。

$('#DatagridTable').dataTable({ 
    'sPaginationType': 'full_numbers',
});

クリックされた行の最初のセルの内容をフォームに送信し、フォームを送信するテーブルの jQuery クリック イベントがあります。関数は次のとおりです。

//  On row click, go to single-view page
$('.c_grid_tr').click(function() {  
    var equipID = $(this).find('td:first').text();
    //  Fill hidden text box on form with value to post
    $('#singleRowID').val(equipID);
    //  Post form
    $('#formEquipment').submit();
});

クリック機能は、Datatables のナビゲーション機能 (別のページに移動、並べ替え、表示されるレコードの数を変更) を使用するまで正常に機能します。しかし、これらのいずれかを実行した後、私のクリックイベントは散発的にしか機能せず、一見ランダムな行でしか機能しません。HTML ソースを見てみましたが、クリック イベントが機能する行と機能しない行は同じです。Firefox でレンダリングされる 2 つの行の例を次に示します。

<tr class='c_grid_tr'>
    <td style='display:none;'>817</td>
    <td class='c_grid_td'>Ground Optic #1</td>
    <td class='c_grid_td'>Zeiss</td>
    <td class='c_grid_td'>950</td>
    <td class='c_grid_td'>DTY</td>
    <td class='c_grid_td'>Storage Facility</td>
    <td class='c_grid_td'>Y</td>
</tr><tr class='c_grid_tr'>
    <td style='display:none;'>818</td>
    <tdclass='c_grid_td'>Ground Optic #1</td>
    <td class='c_grid_td'>Zeiss</td>
    <td class='c_grid_td'>950</td>
    <td class='c_grid_td'>DTZ</td>
    <td class='c_grid_td'>Storage Facility</td>
    <td class='c_grid_td'>Y</td>
</tr>

最初の行はクリック イベントに応答します。2 つ目はそうではありません。この問題は、ページを並べ替えたり、ページを変更したり、表示されるレコードの数を変更したりした後にのみ発生します。クリック イベントにアラート ボックスを配置しましたが、それは発生しません。そのため、2 行目をクリックしてもクリック イベントがアクティブにならないことがわかります。

いつものように、トピックに関するアドバイスをありがとう。

4

2 に答える 2

2

問題は、特定の列が最初のロード（クリックイベントがバインドされたとき）に含まれていた可能性が高いですが、その後のロードでは、ページ全体ではなく、テーブルだけがリロードされるため、イベントは新しいロードにリバウンドされません要素。

テーブルドローでイベントのバインドを解除して再バインドする必要があると思います。つまり、次のようになります。

"fnDrawCallback": function (oSettings) {
    $('.c_grid_tr').unbind();
    //  On row click, go to single-view page
    $('.c_grid_tr').click(function() {  
        var equipID = $(this).find('td:first').text();
        //  Fill hidden text box on form with value to post
        $('#singleRowID').val(equipID);
        //  Post form
        $('#formEquipment').submit();
    });
}
于 2012-11-29T23:33:44.117 に答える
1

JavaScript の onclick 関数呼び出しをインラインで使用して、次のように要素を渡してみてください。

<tr onclick="updateRow(this)">

tr に一意のセレクターが必要で、出力を制御できる場合は、次のように ID またはレコード ID にインデックスを使用します。

<tr id="[create in the output]">
于 2012-11-29T23:36:22.350 に答える