0

次のjQueryコードがあります：

$("#dataTable tbody")
    .on("click", "tr", function (event) {
        $(oTable.fnSettings().aoData).each(function () {
            $(this.nTr).removeClass('row_selected');
        });
        $(this).addClass('row_selected');
        var rk = $(this).attr('data-rk');
        var pk = $(this).attr('data-pk');
        var en = $(this).attr('data-entity');
        var row = $(this).attr('id').split("_")[1];
        var tab = $(this).attr('data-table');
        var params = '?pk=' + pk + '&rk=' + rk;
        var id = en + " " + pk + " - " + rk;

        $("#deleteLink")
            .attr('data-href', '/Admin/' + tab + 's/Delete' + params)
            .attr('data-row', row)
            .attr('data-entity', en)
            .attr('data-title', 'Delete ' + id)
            .attr('title', 'Delete ' + id)
            .prop('disabled', false);

    });

このコードを関数に移動する方法はありますか? 特に、匿名関数の一部ではない $(this) の使用方法について混乱しています。

4

3 に答える 3

2

これのことですか？(ところで、私はあなたのコードを少しリファクタリングしました)

var clickHandler = function () {
    $( oTable.fnSettings().aoData ).each(function () {
        $( this.nTr ).removeClass( 'row_selected' );
    });

    $( this ).addClass( 'row_selected' );

    var rk = $( this ).data( 'rk' );
    var pk = $( this ).data( 'pk' );
    var en = $( this ).data( 'entity' );
    var row = this.id.split( '_' )[1];
    var tab = $( this ).data( 'table' );
    var params = '?pk=' + pk + '&rk=' + rk;
    var id = en + ' ' + pk + ' - ' + rk;

    $( '#deleteLink' )
        .attr({
            'data-href': '/Admin/' + tab + 's/Delete' + params,
            'data-row': row,
            'data-entity': en,
            'data-title': 'Delete ' + id,
            'title': 'Delete ' + id
        })
        .prop( 'disabled', false );
};

その後：

$( '#dataTable' ).on( 'click', 'tbody tr', clickHandler );
于 2012-07-29T14:24:40.463 に答える
1

匿名関数はそのように特別なものではありません。通常の関数を作成して渡すだけです

function external(event) {
    $(oTable.fnSettings().aoData).each(function() {
        $(this.nTr).removeClass('row_selected');
    });
    $(this).addClass('row_selected');
    var rk = $(this).attr('data-rk');
    var pk = $(this).attr('data-pk');
    var en = $(this).attr('data-entity');
    var row = $(this).attr('id').split("_")[1];
    var tab = $(this).attr('data-table');
    var params = '?pk=' + pk + '&rk=' + rk;
    var id = en + " " + pk + " - " + rk;
    $("#deleteLink").attr('data-href', '/Admin/' + tab + 's/Delete' + params).attr('data-row', row).attr('data-entity', en).attr('data-title', 'Delete ' + id).attr('title', 'Delete ' + id).prop('disabled', false);
}
//Pass the function like any other variable
$("#dataTable tbody").on("click", "tr", external);
于 2012-07-29T14:25:16.063 に答える
0

もちろん！イベントをパラメーターとして受け入れる関数を作成するだけです。

$("#dataTable tbody").on("click", "tr", clickHandler);

var clickHanlder = function (event) {
    $(oTable.fnSettings().aoData).each(function () {
        $(this.nTr).removeClass('row_selected');
    });
    $(this).addClass('row_selected');
    var rk = $(this).attr('data-rk');
    var pk = $(this).attr('data-pk');
    var en = $(this).attr('data-entity');
    var row = $(this).attr('id').split("_")[1];
    var tab = $(this).attr('data-table');
    var params = '?pk=' + pk + '&rk=' + rk;
    var id = en + " " + pk + " - " + rk;

    $("#deleteLink")
        .attr('data-href', '/Admin/' + tab + 's/Delete' + params)
        .attr('data-row', row)
        .attr('data-entity', en)
        .attr('data-title', 'Delete ' + id)
        .attr('title', 'Delete ' + id)
        .prop('disabled', false);

};

$(this)この場合、jQuery は正しくバインドします。

于 2012-07-29T14:25:51.100 に答える