我正在编写一个插件,它将创建一些 DIV 并在插件初始化时将样式应用于它们。在下面的示例代码中,我正在做一些事情,比如应用于.disableSelection()
某些元素。
最初我将这些东西放在一个document.ready
包装器中,但后来读到这不是理想的解决方案,因为有人可以在加载文档后很好地调用插件。我的理解是document.ready
在加载文档时触发一次,仅此而已。
如果是这种情况,我可以使用什么来代替document.ready
在插件初始化时应用样式等?
$.examplepluginname = {
id: 'examplepluginname'
,version: '1.0'
,copyright: 'Copyright (c) 2013 Example Name'
,uri: 'http://www.example.com/'
,licensed: {
MIT: 'http://www.opensource.org/licenses/mit-license.php'
,GPL: 'http://www.gnu.org/licenses/gpl.html'
}
/*,plugin: function(prepare,sort){
aPluginPrepare.push(prepare); // function(settings){doStuff();}
aPluginSort.push(sort); // function(valuesAreNumeric,sA,sB,iReturn){doStuff();return iReturn;}
}*/
,defaults: { // default settings
searchDefaultText: 'Search & hit ENTER to add to list' //Text to show when user is not entering a search term
}
};
(function($) {
//Attach this new method to jQuery
$.fn.extend({
//pass the options variable to the function
examplepluginname: function(options) {
var userSettings = $.extend($.examplepluginname.defaults, options)
//Switcher for when the user presses enter before search results come back
,selectOnlyResult = false
//Arrow key navigation setting
,displayBoxIndex = -1
;
/*
RUN INITIALIZATION SETTINGS
*/
$("#availableItems").disableSelection();
displayAvailableItems();
//Set the display styles
$('#tagSearch').css({
'width': '100%',
'border-radius': '5px',
'outline': '0 none',
'padding': '2px 3px',
'font-style': 'italic'
});
return this.each(function() {
});
}
});
})(jQuery);