更新:在帮助下,我找到了这个问题。正是 if(!actions) 对函数引用做了一些事情。一旦我删除了“!”,它就起作用了。这是我的一个错误,因为我想首先检查它是否有引用。我的新问题是那是什么!对函数执行操作符 do 会导致其计算结果为 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");
};
}
问题出在执行操作函数的登录/关闭函数中。当它执行时,调试器会给我这个警告“忽略具有 [LenientThis] 的属性的获取或设置,因为“this”对象不正确。”。该函数未执行。这是 HTML(我省略了外部 jquery 源文件,但我使用的是 JQuery 2.0.3 和 JQuery UI 1.1.3。我无法弄清楚这一点,并且被它困扰。我尝试使用“call”,““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>
最佳答案
您需要将Login
和Close
更改为that.Login =
和that.Close =
。它们目前是函数内部的变量,对外部不可见。还将 buttons: {"Login":Login, Cancel:Close }
更改为 buttons: {"Login":that.Login, Cancel:that.Close }
关于javascript - JS 对象内部的回调不适用于 JQuery 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26900506/