如何将功能提供给其他javascript文件?

时间:2012-09-09 12:46:41

标签: javascript jquery

我有以下代码:

$(document).ready(function(){

function loginLinkClick(e) {
    e.preventDefault();
    $('#loginLink').unbind('click', loginLinkClick);
    dialog(this);
}
function registerLinkClick(e) {
    e.preventDefault();
    $('#registerLink').unbind('click', registerLinkClick);
    dialog(this);
}

$('#loginLink')
    .bind('click', loginLinkClick);
$('#registerLink')
    .bind('click', registerLinkClick);
$('#logoutLink')
    .click(function (e) {
        window.location = $(this).attr('data-href')
    });

});

我希望将loginLinkClick和registerLinkClick函数用于其他javascript文件。有没有办法可以做到这一点?我正在使用jQuery,所以我应该将它们放入jQuery命名空间或类似的东西吗?

还有一个问题。从性能的角度来看或者为了可维护性,我应该在$(document)

之外使用这些函数

3 个答案:

答案 0 :(得分:2)

从本地命名空间中删除它们,然后在“其他javascript文件”之前导入该文件,并且可以使用这些函数。

this post引用Torok Gabor:

  

将其置于内部,以免污染全局命名空间。由于JavaScript的范围链,它还确保更快地解析函数名称。

     

如果它是可重复使用的组件,请将其放在外面,这样您就可以轻松地将其移到单独的文件中并从不同的上下文中调用。

答案 1 :(得分:2)

使功能在该范围之外可用,而不是

function loginLinkClick(e) { }

尝试使用

将它们添加到窗口对象中
window.loginLinkClick = function(e) { }

答案 2 :(得分:2)

将函数添加到window对象或将其移出本地function范围。

$(document).ready(function () { 
    window.loginLinkClick = function (e) {
        e.preventDefault();
        $('#loginLink').unbind('click', loginLinkClick);
        dialog(this);
    };
});

或者:

function loginLinkClick(e) {
    e.preventDefault();
    $('#loginLink').unbind('click', loginLinkClick);
    dialog(this);
};

$(document).ready(function () { ... });