Question

我是jquery的新手，我在构造函数时遇到了问题。我需要一些帮助吗？我不确定我是否已经使用这些功能做了正确的事情？

请解释我如何编写下一个函数或告诉我如何构建正确的语法函数member.panel.init（'login'）没有做正确的事。

member = {};
member.panel = function(){
    return{
    init: function(a)
    {   
        $('#log_in .login').click(open_menu(a));
        $('#log_in .register').click(open_menu(a));
    },

    open_menu: function(what)
    {
         if(what!='login' || what!='register') what='login';
         $('#q_login_dialog #menu-'+what+'').addClass("q_dialog_panel_item_active");
         if(what=='login')
         {
            $('.q_dialog_content #dialog-form3').css("display", "none");
            $('.q_dialog_content #dialog-form2').css("padding-bottom", "20px");
            $(".login-box").fadeIn('fast'); 
         }
         if(what=='register')
         {
            $('.q_dialog_content #dialog-form2').css('display', '');
            $('.q_dialog_content #dialog-form3').css("padding-bottom", "20px");
            $(".login-box").fadeIn('fast'); 
         }   
    }
}
}();
$(function () {
   member.panel.init('login');
});

Answer 1

执行此操作时：

open_menu(a)

...你正在调用那个函数。对于处理程序，您希望将函数传递给click()。你正在这样做，看起来你想保留传递给init的值。这意味着您需要让open_menu函数返回一个引用该值的函数。

不幸的是，您没有显示可以通过这种方式访问的名为open_menu的函数。您的open_menu函数是对象的成员，因此您需要访问它。

您的代码应如下所示：

member = {};
member.panel = function () {
    return {
        init: function (a) { // use "this.open_menu" to refer to the function
            $('#log_in .' + a).click(this.open_menu(a));
        },
        open_menu: function (what) {

            // "open_menu" now returns a handler function that references "login"
            return function () {
                if (what != 'login' || what != 'register') what = 'login';
                $('#q_login_dialog #menu-' + what + '').addClass("q_dialog_panel_item_active");
                if (what == 'login') {
                    $('.q_dialog_content #dialog-form3').css("display", "none");
                    $('.q_dialog_content #dialog-form2').css("padding-bottom", "20px");
                    $(".login-box").fadeIn('fast');
                }
                if (what == 'register') {
                    $('.q_dialog_content #dialog-form2').css('display', '');
                    $('.q_dialog_content #dialog-form3').css("padding-bottom", "20px");
                    $(".login-box").fadeIn('fast');
                }
            };
        }
    }
}();
$(function () {
    member.panel.init('login');
    member.panel.init('register');
});

或者这是一个更接近Rob W评论的替代方案，但修复了open_menu函数引用。

member = {};
member.panel = function () {
    return {
        init: function (a) {
            var self = this;
            $('#log_in .' + a).click(function() {
                self.open_menu(a); 
            });
        },

        open_menu: function (what) {
            if (what != 'login' || what != 'register') what = 'login';
            $('#q_login_dialog #menu-' + what + '').addClass("q_dialog_panel_item_active");
            if (what == 'login') {
                $('.q_dialog_content #dialog-form3').css("display", "none");
                $('.q_dialog_content #dialog-form2').css("padding-bottom", "20px");
                $(".login-box").fadeIn('fast');
            }
            if (what == 'register') {
                $('.q_dialog_content #dialog-form2').css('display', '');
                $('.q_dialog_content #dialog-form3').css("padding-bottom", "20px");
                $(".login-box").fadeIn('fast');
            }
        }
    }
}();
$(function () {
    member.panel.init('login');
    member.panel.init('register');
});

Answer 2

Rob W是对的

仅供参考：.click（）的第一个参数应该是函数引用。在您的代码中，第一个参数是使用参数a对函数open_menu（）进行立即调用（！）的结果。仅当此调用的结果（返回值）是函数引用时，才会生成有效的.click（）参数。

如果将代码移动到Rob W建议的匿名函数（）中，它将导致函数引用（对此匿名函数），只有在触发click事件时才会执行。

在jquery中创建和调用函数

2 个答案: