这段jquery代码不起作用

this jquery code doesn't work?

本文关键字:不起作用 代码 jquery 这段      更新时间:2023-09-26

我发现这个jsfiddle 代码,我需要它,我想在我的php文件中尝试,但它不起作用,而它是相同的代码,我只是复制和粘贴,我不改变任何东西,但它仍然不起作用。

我的代码:

<!DOCTYPE html>
<?php
?>
<html>
<head>
    <title></title>
    <script>
        $("#update").click(function() {
            $("#counter").html(function(i, val) {
                return val*1+1 
            });
        });
    </script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.jss"></script>
</head>
<body>
    <button id="update" type="button">Click Me</button>
    <div id="counter">10</div>
<?php
?>
</body>
</html>

请指出我的错误。任何帮助将不胜感激!

您应该能够自己调试它。打开javascript控制台,注意到上面写着ReferenceError: $ is not defined。这意味着没有加载jquery。现在看看您放入script-src中的URL。为什么以.jss结尾?这里有个打字错误。

如果你改正了,你仍然会得到相同的错误。为什么?因为在包含它之前使用了jquery。所以把包含的jquery库放在自定义代码之前。

现在,它仍然不起作用。为什么?因为你在DOM加载之前附加了一个事件;因此,在处理脚本时,按钮不存在!所以看一下http://api.jquery.com/ready/你应该知道要添加什么,把你的javascript包在$(function() {...})里面然后你就可以进入

可能是jquery.min.jss的一个错别字

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.jss"></script>

必须是jquery.min.js

或者您将javascript放在jquery引用之前。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('#target').click(function() {
    $('#output').html(function(i, val) { return val*1+1 });
});
});
</script>
</head>
<body>
<button id="target" type="button">Click Me</button>
<div id="output">10</div>
</body>
</html>