Question

我一直在使用Codecademy上的jQuery进行实验，但是在下载库之后它似乎没有用。

我按照以下步骤操作：

我从http://jquery.com/download/（更具体地http://code.jquery.com/jquery-1.9.1.min.js）
我重命名了文件jquery.js并将其放在与我的HTML /脚本等相同的源文件夹中。
我在我的HTML文件<script src='jquery.js'> </script>
我使用jQuery的脚本不起作用。我尝试了一个基本测试，以查看jQuery是否正常工作 - $(document).ready(function(){ alert("Hello jQuery"); });

我有什么遗漏的吗？

（我的代码在Codecademy上运行得非常好，所以我认为在我的程序中其他地方不太可能出现问题）

修改1：

（完整代码，对于那些问:)）

HTML / jQuery

    <script src='jquery.js'>
        $(document).ready(function() {
            alert("Hello jQuery!"); 
            $('.matchtile').click(function() {
                $(this).fadeTo('slow', 0); 
            });
            $('.button').click(function() {
                fadeIn(); 
            });
        });

        function fadeIn(){
            $('.matchtile').fadeTo('slow', 1); 
        }
    </script> 
    <title></title>
</head>
<body>
    <div class="matchtile"></div>
    <div class="matchtile"></div>
    <div class="matchtile"></div>
    <div class="matchtile"></div>
    <div class="button"></div>
</body>

CSS

.matchtile {
    border-radius: 100%;
    background-color: #FF0000;
    width: 30px;
    height: 30px; 
    margin: 30px; 
}

.button {
    background-color: #663333; 
    width: 30px;
    height: 30px;
    border-radius: 10%; 
    margin: 30px; 
}

Answer 1

<script src='jquery.js'></script>
<script>
$(document).ready(function() {
        alert("Hello jQuery!"); 
        $('.matchtile').click(function() {
            $(this).fadeTo('slow', 0); 
        });
        $('.button').click(function() {
            fadeIn(); 
        });
    });

    function fadeIn(){
        $('.matchtile').fadeTo('slow', 1); 
    }
</script> 
<title></title>
</head>
<body>
<div class="matchtile"></div>
<div class="matchtile"></div>
<div class="matchtile"></div>
<div class="matchtile"></div>
<div class="button"></div>
</body>

Answer 2

变化：

<script src='jquery.js'>
    $(document).ready(function() {
        alert("Hello jQuery!"); 
        $('.matchtile').click(function() {
            $(this).fadeTo('slow', 0); 
        });
        $('.button').click(function() {
            fadeIn(); 
        });
    });

    function fadeIn(){
        $('.matchtile').fadeTo('slow', 1); 
    }
</script>

为：

<script src='jquery.js'></script>

<script type='text/javascript'>
    $(document).ready(function() {
        alert("Hello jQuery!"); 
        $('.matchtile').click(function() {
            $(this).fadeTo('slow', 0); 
        });
        $('.button').click(function() {
            fadeIn(); 
        });
    });

    function fadeIn(){
        $('.matchtile').fadeTo('slow', 1); 
    }
</script>

您的jQuery代码不应位于加载实际jQuery.js的相同脚本标记中

Answer 3

我使用Google的托管版jQuery编写了相同的示例，只是为了消除库位置作为潜在的失败点。这很好，在本地测试：

<html>
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            alert("Hello jQuery"); 
        });
    </script>
</head>
<body>
</body>

无法让jQuery工作

3 个答案: