1

私は、Datatables の KeyTable プラグインで動作するグリッド コントロールに取り組んできました。あちこちでいくつかの微調整を行ってすべてがうまくいっていますが、プラグインには厄介な問題が 1 つあります。以下は、プラグイン ページのサンプル コードです。

$(document).ready( function () {
    var keys = new KeyTable( {
        "table": document.getElementById('example')
    } );

    /* Apply a return key event to each cell in the table */
    keys.event.action( null, null, function (nCell) {
        /* Block KeyTable from performing any events while jEditable is in edit mode */
        keys.block = true;

        /* Initialise the Editable instance for this table */
        $(nCell).editable( function (sVal) {
            /* Submit function (local only) - unblock KeyTable */
            keys.block = false;
            return sVal;
        }, {
            "onblur": 'submit',
            "onreset": function(){
                /* Unblock KeyTable, but only after this 'esc' key event has finished. Otherwise
                 * it will 'esc' KeyTable as well
                 */
                setTimeout( function () {keys.block = false;}, 0);
            }
        } );

        /* Dispatch click event to go into edit mode - Saf 4 needs a timeout... */
        setTimeout( function () { $(nCell).click(); }, 0 );
    } );
} );

私が知る限り、リターンキーが押されるまでセルは「編集可能」になりません。その後、クリックイベントが追加されます。クリック イベントをアタッチする方法はありますか (私の場合は dblclick が必要です)、リターンを押す前にセルにアタッチする方法はありますか? 関数を「td.focus」と「example td」にバインドしようとしましたが、うまくいきませんでした。各セルがロードからの dblclick に応答するだけでなく、キーにも応答するようにします。

4

2 に答える 2

1

編集するセルにダブルクリック イベントをバインドし、リターン キーをシミュレートするだけです。

$('.cells').dblclick(function() {
    e = jQuery.Event("keypress");
    e.which = 13;
    e.keyCode = 13;
    $(this).trigger(e);
});
于 2012-10-10T22:40:28.550 に答える
0

表のセルに dblclick デリゲートを追加しましたが、これを機能させるための鍵は最後の行でした。

$('#' + tableID).delegate('tr td.focus', 'dblclick', function () {
        $(this).editable(updateURL, 
            {
             "callback": function (value, settings) {
                keys.block = false;
             },
             "onblur": 'submit',
             "onreset": function(){
                setTimeout( function () {keys.block = false;}, 0);
             }
            } 
        );
        $(this).dblclick();
    });

例に表示されている setTimeout 関数を使用した間接的なクリック イベント呼び出しが jEditable イベントを発生させていたので、これを取り除きました。クリック イベントを直接呼び出すだけで動作します。

于 2012-10-11T02:54:52.487 に答える