JS对象内的回调不适用于JQuery事件答案

【问题标题】：Callback inside JS Object Not Working on JQuery eventJS对象内的回调不适用于JQuery事件
【发布时间】：2014-11-14 11:50:38
【问题描述】：

更新：在帮助下，我能够找到问题所在。是 if(!actions) 对函数引用做了一些事情。一旦我删除了“！”，它就起作用了。这是我的一个错误，因为我想首先检查它是否有参考。我的新问题是那是怎么回事！运算符对会导致其评估为 true 的函数执行操作，然后更改导致函数失败的引用（在这种情况下，调试器中没有检测到错误）？

原文： 我创建了一个 javascript 函数，它封装了一些变量并在单击 JQuery UI 对话框按钮时执行回调。这是函数的javascript：

function LoginControl(parentDiv, usernameInput, passwordInput, action)
{
    var that = this;
    var container = parentDiv;
    var user = usernameInput;
    var password = passwordInput;
    var actions = action;

    that.init = function()
    {
        container.dialog(
            {
                modal:true,
                show:false,
                buttons: {"Login":Login, Cancel:Close }
            }
        );
    };

    var Login = function (evt) {
        if (!actions)
            actions();
    };

    var Close = function()
    {
        container.dialog("close");
        if(!actions)
            actions();
    };

    that.show = function(evt)
    {
        container.dialog("open");
    };
}

问题出在执行操作功能的登录/关闭功能中。当它执行时，调试器给我这个警告“忽略 get 或 set of property that has [LenientThis] 因为“this”对象不正确。”。该功能未执行。这是 HTML（我省略了外部 jquery 源文件，但我使用的是 JQuery 2.0.3 和 JQuery UI 1.1.3。我无法弄清楚这一点并被它所困扰。我尝试使用“调用”，“ bind", 和"apply" 方法都无济于事。请帮忙指教。谢谢！

<html>
<head lang="en">
    <script type="text/javascript">
        function onAction()
        {
            alert("Hello!");
        }

        $(document).ready(function() {
            var loginCtrl = new LoginControl($("#login"), $("#username"), $("#pass"), onAction);

            loginCtrl.init();
            loginCtrl.show();
        });
    </script>
</head>
<body>
<div id="login">
    <form>
        <label for="username">User Name:</label> <input type="text" id="username" /><br>
        <label for="pass">Password:</label><input type="password" id="pass" />
    </form>
</div>
</body>
</html>

【问题讨论】：

标签： javascript jquery jquery-ui-dialog

【解决方案1】：

您需要将Login 和Close 更改为that.Login = 和that.Close =。它们目前是函数内部的变量，外部不可见。还将buttons: {"Login":Login, Cancel:Close } 更改为buttons: {"Login":that.Login, Cancel:that.Close }

【讨论】：

那行不通。产生了相同的结果。当我在调试器中检查操作变量时，它将它显示为一个函数。当它执行时，手表显示它有一个未定义的返回值，它在你建议的更改之前已经在做。出于好奇，我决定在 LoginControl 函数中创建 onAction 函数并调用它而不是 actions 变量。那工作罚款。但是当我在 init 中将动作分配给 onAction 函数时，它又回到了原点。在这一点上，我认为这是一个范围问题，但我不知道如何纠正它。
我忘了加，你需要把var actions = action;改成that.actions = action然后调用action为that.actions();。你能把这些和答案的变化一起试试吗？
我做了你建议的修改，但结果相同。
你能复制粘贴到你的控制台看看你得到了什么吗？ --> function f1(act){ var that = this; that.acts = act; console.log(that.acts); that.callActs = function(){ that.acts(); } }; function f2(){ console.log("f2 here"); } var f1 = new f1(f2); f1.callActs();
@stn9000 你对上一条评论中的代码有什么了解吗？