5

这是我的 HTML 页面：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>

<script type="text/javascript" src="jquery-1.8.2.min.js"></script>

<script type="text/javascript" src="myscript.js"></script>

<script type="text/javascript">

$(document).ready(function() {
function closecontactform(){
alert("closing the form");
};
});
</script>
</head>
<body>
<p id="elementname">Click me to call function</p>
</body>

这是在 myscripts.js 文件中：

$(document).ready(function() {
$('#elementname').click(function() {
alert("click detected");
closecontactform();
}); 
});

我的实际页面比这要复杂得多，并且包含很多 jquery，但这是仅显示必要代码的基本问题。我希望能够从一个单独的 .js 文件中调用一个函数，而该函数是在主页中定义的。在这个基本的简单版本中，我尝试删除 $(document).ready(function()... 并在这个简单的示例中有所帮助，但是我在更复杂的页面中需要该行，因为删除它似乎会破坏我所做的一切在。

您会看到“检测到的点击”被调用，但“关闭表单”没有。

你能给我任何指示吗？

谢谢，

4

3 回答 3

13

你有一个范围问题。您不需要将命名函数包装在$(document).ready().

如果包装在ready它的范围内，则由于函数内的封闭，它仅在该准备好的函数内可用。

例子：

$(document).ready(function() {
    function doAlert() {
        alert('foo');
    } 
    /* can call function since scope in same parent function*/
    doAlert();
}); 
/* function not in scope, is undefined here*/
doAlert();

重构所以函数是全局可用的，如果从任何地方调用都可以工作。将在以下两种情况下工作：

function doAlert() {
    alert('foo');
}

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

进一步说明：

许多人担心使用 jQuery 选择器和方法的函数必须包装在$(document).ready(). 外部的命名函数ready可以包含所有 jQuery 代码......但是......它们需要在 DOM 准备好后调用以确保 html 存在

于 2012-12-22T23:56:49.173 回答
0

你试过搬家吗

<script type="text/javascript" src="myscript.js"></script>

<body>在-tag下方？

于 2012-12-22T23:56:29.743 回答
0

首先，您需要将脚本标签移动到标签的正上方</body>。

其次，如果您只是删除准备好的文档，那应该可以在上面工作。问题是您在闭包含义内定义了您的函数，它超出了范围。您的函数不必在文档中准备好，因为它只会在另一个文档准备就绪时被触发（意味着文档已准备好）。

于 2012-12-22T23:58:57.530 回答