参考 Jquery 中的 Javascript 文件答案

【问题标题】：Refer to a Javascript File in Jquery参考 Jquery 中的 Javascript 文件
【发布时间】：2010-09-15 16:53:57
【问题描述】：

我有一个简单的 HTML。我将 JQuery 用于 AJAX 目的。现在，我想将我的 javascript 函数放在一个单独的 javascript 文件中。这个的语法是什么？例如，目前我在 HTML 中的脚本部分是这样的：

<script>
<script type="text/javascript" src="scripts/scripts.js"></script>
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type = "text/javascript" language="javascript">
 $(document).ready(function() {
   $("#SubmitForm").click(Submit());
 });
</script>

但我想把函数放

function() {
   $("#SubmitForm").click(Submit());
 })

在文件 scripts.js 中。我可以使用为该函数分配名称并引用它吗？

编辑：我这里还有点问题：我把代码改成了

<script type = "text/javascript" language="javascript">
$(document).ready(function() {
    $("#SubmitForm").click(submitMe);
});
</script>

在一个单独的 js 文件中，我有以下代码：

var submitMe = function(){
alert('clicked23!');
//$('#Testing').html('news');
};

这是正文部分：

<body>
welcome
<form id="SubmitForm" action="/showcontent" method="POST">
<input type="file" name="vsprojFiles" />
<br/>
<input type="submit" id="SubmitButton"/>
</form>

<div id="Testing">
hi
</div>

</body>

但是，它仍然无法正常工作，我想念什么吗？

【问题讨论】：

你能发布你的 HTML 标记吗？

标签： jquery

【解决方案1】：

将 scripts.js script 标记向下移动到 jQuery script 标记下方，然后将整个内联脚本块移动到 scripts.js 中。由于 jQuery 在 scripts.js 加载时已经被实例化，因此 Javascript 将像现在一样内联执行。

另外在一个单独的说明中，你需要改变

$("#SubmitForm").click(Submit());

到

$("#SubmitForm").click(Submit);

您不需要括号，因为此时您没有执行函数，只是告诉 click 事件处理程序这是您要在事件触发时执行的函数的名称。

另外，您可以将$(document).ready( 替换为$( 即：

 $(function() {
   $("#SubmitForm").click(Submit);
 });

$ 和 document.ready 都可以包含在页面的任何位置（或外部文件中），只要 jQuery.js 在范围内，它们就会同时触发（一旦加载了 DOM）-你不必担心它是最后一段要触发的代码。这就是为什么您可以将整个内容移至 scripts.js 而无需为函数指定名称并从内联脚本中引用它。

作为记录，如果您确实希望通过名称引用函数，只需将其定义为变量：

var func = function() {
  $("#SubmitForm").click(Submit);
};

$(func);

就像我说的那样，在您的情况下这可能有点矫枉过正，您不妨将整个内容移至 scripts.js（当然，除非您在问题中提到的内容更多。

编辑（处理对问题的编辑）：看起来您正在处理错误的事件处理程序。您正在尝试将函数分配给表单的单击事件处理程序，而您确实希望将其分配给提交按钮的处理程序。因此，您应该使用选择器“#SubmitButton”，即：

$("#SubmitButton").click(Submit);

【讨论】：

【解决方案2】：

是的，这不是问题，只需将函数存储为变量，就像您存储其他函数一样。

var myfunc = function(){
    // Do some stuff
}

然后您可以使用以下语法在您的 jQuery init 函数中运行它：

$(document).ready(myfunc);

对于在文档就绪上运行的代码还有一个快捷语法，它只是将一个函数传递给 jQuery：

$(myfunc);

【讨论】：

【解决方案3】：

为什么不转储

$(document).ready(function() {
    $("#SubmitForm").click(Submit);
});

在外部文件中？它将按目前的方式工作，因为您可以堆叠 onDomReady 事件。

你的 html 应该是这样的（注意第一个 <script> 不好）：

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

【讨论】：

【解决方案4】：

$('head').append('&lt;script type="text/javascript" src="scripts/scripts.js"/&gt;')

【讨论】：