14

jQueryv1.8.3とjQueryUIv1.9.2を使用しています。一部のオプションとメソッドだけを追加してオーバーライドし、他の機能は公式リリースにあるもののままにして、既存のjQuery UIウィジェット(私の場合はオートコンプリートウィジェット)を拡張したいと思います。どうすればそれを「適切な」(おそらく「標準的な」)方法にすることができますか?


PS:Web(1、2、...)で検索したところ、主に新しいjQuery UIウィジェットの作成に関連しているが、既存のウィジェットの拡張には関連していないドキュメントが見つかりまし

4

1 に答える 1

40

jQuery UI 1.9以降では、ウィジェットの拡張は、新しいウィジェットの作成と同じ方法で行われます。ウィジェットファクトリ($.widget())は、いくつかのシナリオをサポートしています。

ベースウィジェット($.Widget)を開始点として使用して新しいウィジェットを作成します。

$.widget( "ns.widget", { ... } )

既存のウィジェットから継承する新しいウィジェットを作成します。

$.widget( "ns.widget", $.ns.existingWidget, { ... } )

ウィジェットの拡張:

$.widget( "ns.widget", $.ns.widget, { ... } )

拡張構文と継承構文が同じであることに気付くでしょう。ウィジェットファクトリは、作成しているウィジェットと継承しているウィジェットが同じであり、適切に処理していることに気付くほど賢いです。

ウィジェットを継承または拡張する場合、変更または追加するものを定義するだけで済みます。継承とコンテキストを変更するメソッドの操作を容易にするために、ベースウィジェットに存在するいくつかの新しいメソッドもあります。メソッドとその説明の完全なリストについては、 jQuery.Widgetのドキュメントをお読みください。ウィジェットを拡張する場合は、_super()について必ず読んでください。

delayこれは、デフォルトのオプションをに変更し、すべての提案に追加される500新しいオプションを追加する例です。prefix

$.widget( "ui.autocomplete", $.ui.autocomplete, {
    options: {
        delay: 500,
        prefix: ""
    },

    _renderItem: function( ul, item ) {
        var label = item.label;
        if ( this.options.prefix ) {
            label = this.options.prefix + " " + label;
        }
        return $( "<li>" )
            .append( $( "<a>" ).text( label ) )
            .appendTo( ul );
    },
});
于 2012-12-07T12:51:38.967 に答える