gpt4 book ai didi

javascript - 新的 jQuery 函数应该放在 jQuery 命名空间中吗?

转载 作者:行者123 更新时间:2023-11-30 18:57:01 26 4
gpt4 key购买 nike

上下文:使用 Django ModelForm 和模板、jQuery 1.3.2、IE8、Firefox 3.5 或 Safari 4 上的 JavaScript 生成的 HTML 小部件。过程:一个普通的 JavaScript 函数,里面有一些 jQuery,或者 jQuery Enlightenment,Cody Lindley,“向 jQuery 命名空间添加新函数”,第 12 页。 116.

我有一个 jQuery 结构,它用不同的变量重复了几次,所以一直在乞求将其变成一个函数。基本上,一些小部件需要根据其他小部件的值启用或禁用。我用两种方式编写了这个函数。第一种方式,在普通 JavaScript 函数中使用 jQuery 代码,如下所示:

function enable_or_disable_by_selection(master_id, master_id_value, dependent_ids) {
/*
* The master_id argument is the id attribute string of the master select element in the form
* "#id_select_element_name".
* The master_id_value argument is the selection value, a string, that causes the dependent
* elements to be enabled when it is selected. In all other cases, they are disabled.
* The dependent_ids argument is an array of dependent id attribute strings, such as
* ["#id_element_1", "#id_element_2", "#id_element_3"]
*/

/* ON CHANGE OF master_id SELECTION ELEMENT: */
$(master_id).change(function() {
/* If master_id_value is chosen, enable inputs for elements in dependent_ids: */
if ($(master_id).val() == master_id_value) {
for (var i = 0; i < dependent_ids.length; i++) {
$(dependent_ids[i]).removeAttr("disabled");
}
}
/* Otherwise disable inputs for elements in dependent_ids: */
else {
for (var i = 0; i < dependent_ids.length; i++) {
$(dependent_ids[i]).attr("disabled", true);
}
}
});
}

这行得通。第二种方法,由非常能干的 Lindley 先生推荐,将我的新函数放在 jQuery 命名空间中。可以看到他推荐的基本构造 here .这有助于我“避免创建可能产生冲突的全局代码”。下面是我的函数代码,遵循这些建议:

(function($){
$.enable_or_disable_by_selection = function(master_id, master_id_value, dependent_ids){
/*
* The master_id argument is the id attribute string of the master select element in the form
* "#id_select_element_name".
* The master_id_value argument is the selection value, a string, that causes the dependent
* elements to be enabled when it is selected. In all other cases, they are disabled.
* The dependent_ids argument is an array of dependent id attribute strings, such as
* ["#id_element_1", "#id_element_2", "#id_element_3"]
*/

/* CHANGE OF master_id SELECTION ELEMENT: */
$(master_id).change(function() {
/* If master_id_value is chosen, enable inputs for elements in dependent_ids: */
if ($(master_id).val() == master_id_value) {
for (var i = 0; i < dependent_ids.length; i++) {
$(dependent_ids[i]).removeAttr("disabled");
}
}
/* Otherwise disable inputs for elements in dependent_ids: */
else {
for (var i = 0; i < dependent_ids.length; i++) {
$(dependent_ids[i]).attr("disabled", true);
}
}
});
};
})(jQuery);

这也行。这与 jQuery 中包含的逻辑相同。

我知道 jQuery 使用匿名函数和闭包来维护封闭的命名空间。请参阅 John Resig 的“使用 (function(){})()”,here .但是,当我研究这两个片段时,我很难看出第一个更简单版本的风险。另外,我认为第二种方法有点慢是不是错了?请帮我看看第二个版本的优点。我想知道为什么这样做。

随时欢迎与问题无关的有用观察。

最佳答案

1 - 第一个版本的风险来自于您的函数是全局的,例如,一些其他随机库被添加到您的页面,它覆盖了您的函数,它将有对小部件的其余 API 造成灾难性影响。

我认为您想要创建可再分发的小部件,并且您必须对您的代码采取防御措施,尽可能多地将您的库代码保密,并且在引入全局对象时您应该非常有选择性和谨慎。

2 - 第二个示例并不,您只是向 jQuery 对象添加一个成员,属性名称解析的时间确实微不足道。

我建议您阅读有关命名空间和库设计的内容:

关于javascript - 新的 jQuery 函数应该放在 jQuery 命名空间中吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1656450/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com