[英]How to extend an existing jQuery UI widget?
在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
的示例,该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 );
},
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.