我以为我定义了jQuery函数，但是我不断收到“未定义”错误。为什么是这样？

Question

我的HTML文件：

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" />
        <script src="script.js" type="text/javascript"></script>
    </head>
    <body>
        <form name="someForm">
            <input type="button" value="Click me" onClick="myFunction()" />
        </form>
        <div id="result"></div>
    </body>
</html>

我的script.js文件：

function myFunction(){
    $("#result").html("BUTTON WORKS");
}

我有Firebug，每当我单击按钮时，Firebug都会向我抛出此错误：

ReferenceError：未定义myFunction

我究竟做错了什么？

Answer 1

script不能是HTML中的自闭标签（它在某些浏览器中有效，具体取决于文档类型，但这是不正确的）。 您必须添加一个结束标记。

更换

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" />

与

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

由于此错误，指向脚本的script元素可能未正确解析。

从规范：

脚本元素必须同时具有开始标签和结束标签。

块引用

Answer 2

可能是由于文件参考问题。

最好将事件附加在js文件而不是HTML中。

<form name="someForm">
    <input type="button" id="btn" value="Click me" />
</form>


$('#btn').on('click', function(){
    $("#result").html("BUTTON WORKS");
});

Answer 3

您是在本地（地址栏中有file:// ）还是从某个服务器（地址栏中的http://协议）打开该文件？ 因为如果您在本地打开文件，则实际上尝试从地址加载jquery：

文件：//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js

这是不正确的。 发生这种情况的原因是，您使用//ajax.googleapis.com/...作为地址，该地址与当前打开的页面使用相同的协议。

可以将其更改为：

http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js

将文件上传到某台服务器（甚至在本地安装），并通过完整的http请求进行测试。

Answer 4

我通过组合@ Susbanth，@ MBO和@dystroy的答案解决了这个问题。

这是我的新HTML文件：

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script src="script.js" type="text/javascript"></script>
    </head>
    <body>
        <form name="someForm">
            <input type="button" value="Click me" />
        </form>
        <div id="result"></div>
    </body>
</html>

我在jQuery源代码中添加了“ http”，关闭了标签，并从HTML内部删除了“ onClick”。

这是更新的script.js文件：

$(document).ready(function(){
    $("input[type=button]").on("click",function(){
        $("div#result").html("BUTTON WORK");
    });
});

我将onClick事件设为jQuery事件。

我以为我定义了jQuery函数，但是我不断收到“未定义”错误。为什么是这样？

问题描述

4 个解决方案

解决方案1
2 2012-11-19 20:36:24

解决方案2
1 2012-11-19 20:36:04

解决方案3
1 2012-11-19 20:55:25

解决方案4
1 已采纳 2012-11-19 21:03:11

我以为我定义了jQuery函数，但是我不断收到“未定义”错误。 为什么是这样？

问题描述

4 个解决方案

解决方案1 2 2012-11-19 20:36:24

解决方案2 1 2012-11-19 20:36:04

解决方案3 1 2012-11-19 20:55:25

解决方案4 1 已采纳 2012-11-19 21:03:11

我以为我定义了jQuery函数，但是我不断收到“未定义”错误。为什么是这样？

解决方案1
2 2012-11-19 20:36:24

解决方案2
1 2012-11-19 20:36:04

解决方案3
1 2012-11-19 20:55:25

解决方案4
1 已采纳 2012-11-19 21:03:11