0

ここにjqueryスライド関数の長いリストがあります：

IDは異なりますが、動作は同じです。

コード：

/*DataTables*/

$(document).ready( function() {
    $('#all-active-users').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );

$(document).ready( function() {
    $('#all-deactivated-users').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );


$(document).ready( function() {
    $('#all-ppmps').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );        

$(document).ready( function() {
    $('#agency-users').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );

$(document).ready( function() {
    $('#all-ppmps-by-agency').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );

$(document).ready( function() {
    $('#ppmp-form').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );


$(document).ready( function() {
    $('#all-agencies').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );

$(document).ready( function() {
    $('#ppmp-uploaded-files').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );

$(document).ready( function() {
    $('#agency-types').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );

私が知りたいのは、どうすれば短く正確にすることができるかということです。

私はこのようなことを試みましたが、運がありませんでした：

$(document).ready( function() {
    $('#all-active-users').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );

    $('#all-deactivated-users').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );

私がそれを短くしようとするときはいつでも、コードは死んでいます。

任意の回避策をいただければ幸いです。ありがとう。

4

3 に答える 3

3

プラグインが複数のセレクターをサポートしている場合は、次のことを試してください。

$(document).ready(function () {
    $('#all-active-users, #all-deactivated-users, #all-ppmps, #agency-users, #all-ppmps-by-agency, #ppmp-form, #all-agencies, #ppmp-uploaded-files, #agency-types')
    .dataTable({
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    });
});

each()：を使用して試すこともできます

$(document).ready(function () {
    $('#all-active-users, #all-deactivated-users, #all-ppmps, #agency-users, #all-ppmps-by-agency, #ppmp-form, #all-agencies, #ppmp-uploaded-files, #agency-types')
    .each(function () {
        $(this).dataTable({
            "bJQueryUI": true,
            "sPaginationType": "full_numbers"
        });
    });
});
于 2013-02-07T04:17:42.663 に答える
3

それらのそれぞれにクラスを割り当てますmySlider 

$(document).ready( function() {
    $('.mySlider').dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );
} );
于 2013-02-07T04:15:44.113 に答える
2

すべてのプログラミングに適用できるルールがあります。繰り返さないでください。

すべてのメソッドが同じことをしていることに気づきましたか？したがって、実行したいのは、それをカプセル化してから、変更ごとにそれを呼び出すことです。

次のような関数を作成します。

var doSomething = function(selector){

    $(selector).dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );

};

これで、次のような任意のセレクターに対して呼び出すことができる関数ができました。

$(document).ready( function() {

var doSomething = function(selector){

    $(selector).dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers"
    } );

};

    doSomething('#all-active-users');
    doSomething('#all-deactivated-users');

} );

ほぼそこにありますが、私たちはまだ毎回それを呼び出すことによって自分自身を繰り返しています。だから、なぜこれをしないのですか？

$.each(['#all-active-users', '#all-deactivated-users'], function(index, value) { 
  doSomething(value);
});
于 2013-02-07T04:20:00.030 に答える