Javascript jQuery单击事件不工作_Javascript_Jquery_Javascript Events

Javascript jQuery单击事件不工作

javascript jquery

Javascript jQuery单击事件不工作,javascript,jquery,javascript-events,Javascript,Jquery,Javascript Events,下面的代码使用XAMPP在localhost上运行良好。但它在另一台服务器上不工作 <!DOCTYPE html> <html> <head> <script src="jquery-latest.js"></script> </head> <body> word: <input type="text" id="sub" /> u

下面的代码使用XAMPP在

localhost

上运行良好。但它在另一台服务器上不工作

<!DOCTYPE html>
<html>
    <head>
        <script src="jquery-latest.js"></script>
    </head>
    <body>
        word: <input type="text" id="sub" />
        user: <input type="text" id="user" />

        <button type="button" id="btn">Click Me!</button>

        <script>
            $("#btn").click(function () {
                var word=$("#sub").val();
                var usr=$("#user").val();
                alert("hi");
            });
        </script>
    </body>
</html>


字：
用户：
点击我！
$（“#btn”）。单击（函数（）{
var word=$（“#sub”）.val（）；
var usr=$（“#user”）.val（）；
警报（“hi”）；
});

Chrome inspect element有2个错误：

Uncaught SyntaxError:jquery latest.js:5669输入意外结束

未捕获引用错误：$未定义

检查jquery-latest.js与html文件的目录是否相同。否则代码就可以了，也可以工作。在脚本中添加类型。试试这个

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

您需要在

$（document）.ready（）事件中连接单击处理程序
<!DOCTYPE html>
<html>
    <head>
        <script src="jquery-latest.js"></script>
        <script>
        $(document).ready(function() {
            $("#btn").click(function () {
                var word=$("#sub").val();
                var usr=$("#user").val();
                alert("hi");
            });
        });
        </script>
    </head>
    <body>
        word: <input type="text" id="sub" />
        user: <input type="text" id="user" />

        <button type="button" id="btn">Click Me!</button>
    </body>
</html>


$（文档）.ready（函数（）{
$（“#btn”）。单击（函数（）{
var word=$（“#sub”）.val（）；
var usr=$（“#user”）.val（）；
警报（“hi”）；
});
});
字：
用户：
点击我！
您的html文件的同一文件夹中是否有“jquery-latest.js”的副本？您是否忘记将jquery-latest.js部署到服务器上？当然……该文件在那里，我首先检查了：）一些其他问题，我想尝试使用webkit inspector或Firefox的firebug工具查看jquery javascript文件是否正在加载。需要注意的一点是，Windows文件系统不区分大小写，但大多数Linux文件系统区分大小写，因此，请检查jquery latest.js
文件的大小写是否正确。@Strelok和davidbuzatto:-当代码位于正文末尾的脚本块中时，不需要使用document ready：脚本将在解析之前的任何元素之后执行。未捕获语法错误：输入jquery latest的意外结束。js:5669未捕获ReferenceError:$未定义，因此您可以从一些jQuery CDN中包含jQuery:不，您不需要。浏览器基本上从上到下解析文档，脚本块可以访问它们上面的元素，因为这些元素已经被解析并添加到DOM中。在OP的代码中，脚本块位于正文的末尾，因此所有元素都可以从代码中访问。head标记中的脚本会减慢页面的呈现速度，因此如果可能，最好将脚本放在正文的末尾。@Jaison解决方案是什么？