在 jQuery 插件中添加附加功能
我开始在自己的命名空间内编写更多 jQuery 插件,这样我就可以重用代码并保持代码干燥。
我对整个插件创作很陌生,但阅读了一些资料,包括官方的 jQuery 资料。
这是我发现的一个例子:
(function($) {
// jQuery plugin definition
$.fn.reverseText = function(params) {
$.fn.reverseText.test();
// merge default and user parameters
params = $.extend({
minlength: 0,
maxlength: 99999
}, params);
// traverse all nodes
this.each(function() {
console.log($(this).parent().data('url'));
// express a single node as a jQuery object
var $t = $(this);
// find text
var origText = $t.text(),
newText = '';
// text length within defined limits?
if (origText.length >= params.minlength && origText.length <= params.maxlength) {
// reverse text
for (var i = origText.length - 1; i >= 0; i--) newText += origText.substr(i, 1);
$t.text(newText);
}
});
// allow jQuery chaining
return this.each;
};
// Is this correct?
$.fn.reverseText.test = function() {
alert('test');
};
})(jQuery);
$(function() {
$(".js-test-whatever li:even").reverseText();
});
一般来说,我会创建一个像这样的命名空间:
var a = {
};
a.reverseText = {
init: function () {
reverseText();
});
},
reverse: function() {
$(function() {
return foo;
});
}
a.reverseText.init();
那么在 jQuery 插件命名空间中添加多个函数的正确方法是什么?
请查看第一个示例中的注释,其中我包含了一个附加函数。
I'm starting to write more jQuery plugins within their own namespace so I can re-use code and to keep my code DRY.
I'm new to the whole plugin authoring, but read a few sources including the official jQuery one.
Here is an example I found that I'm playing around with:
(function($) {
// jQuery plugin definition
$.fn.reverseText = function(params) {
$.fn.reverseText.test();
// merge default and user parameters
params = $.extend({
minlength: 0,
maxlength: 99999
}, params);
// traverse all nodes
this.each(function() {
console.log($(this).parent().data('url'));
// express a single node as a jQuery object
var $t = $(this);
// find text
var origText = $t.text(),
newText = '';
// text length within defined limits?
if (origText.length >= params.minlength && origText.length <= params.maxlength) {
// reverse text
for (var i = origText.length - 1; i >= 0; i--) newText += origText.substr(i, 1);
$t.text(newText);
}
});
// allow jQuery chaining
return this.each;
};
// Is this correct?
$.fn.reverseText.test = function() {
alert('test');
};
})(jQuery);
$(function() {
$(".js-test-whatever li:even").reverseText();
});
Generally I'd create a namespace like this:
var a = {
};
a.reverseText = {
init: function () {
reverseText();
});
},
reverse: function() {
$(function() {
return foo;
});
}
a.reverseText.init();
So what's the proper way to add multiple functions within a jQuery plugin namespace?
Look at the comment in the first example of where I included an additional function.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
这是一种可以接受的方式。另一种方法可能是这样的:
没有一种“正确”的方法。只需使用最适合您当前正在进行的项目的方法即可。
That is an acceptable way to do it. Another way to do it could be like this:
There is no one "correct" way. Just use whatever works best for the project that you are currently working on.