0

HTML/CSS/jQueryを始めたばかりで、基本的なことを始めてみました。現在、.html、.css、.js があります。私の index.html は .css をロードしますが、.js をロードしません。私のコードに何か問題がありますか?

HTML

<!DOCTYPE html>
<html>
<head>
    <title>Super Mario!</title>
    <link rel='stylesheet' type='text/css' href='stylesheet.css'/>
    <script type="text/javascript" src="script.js"></script>

</head>
<body>
    <img src="http://i1061.photobucket.com/albums/t480/ericqweinstein/mario.jpg"/>
</body>
</html>

CSS

img {
    position: relative;
    left: 100px;
    top: 100px;
}

JQuery

$(document).ready(function() {
$(document).keydown(function(key) {
    switch(parseInt(key.which,10)) {
        case 65:
            $('img').animate({left: "-=10px"}, 'fast');
            break;
        case 83:
            $('img').animate({top: "+=10px"}, 'fast');
            break;
        case 87:
            $('img').animate({top: "-=10px"}, 'fast');
            break;
        case 68:
            $('img').animate({left: "+=10px"}, 'fast');
            break;
        default:
            break;
    }
});
});

これが機能しない理由を理解するのを手伝ってください。いくつかの追加情報、それらはすべてデスクトップの同じフォルダーにあります。サブフォルダーはありません。

4

4 に答える 4

6

JavaScript ファイルで jQuery コードを使用していますが、HTML に jquery Lib を含めません。

スクリプトをロードする前に、次の行を追加します (または、ホストされている jQuery ライブラリへの別のリンクに置き換えることができます) (現在の jQuery バージョンを使用していると仮定します。それ以外の場合は、適切なバージョンを含めます)。

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

したがって、次の<head>ようになります。

<!-- some code -->
<head>
    <title>Super Mario!</title>
    <link rel='stylesheet' type='text/css' href='stylesheet.css'/>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="script.js"></script>
</head>
<!-- some code -->
于 2013-05-17T07:04:21.197 に答える
1

jQuery ライブラリは含まれていません。これを頭に入れます：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
于 2013-05-17T07:04:46.850 に答える
0

任意のCDNからjqueryを追加

<head>
    <title>Super Mario!</title>
    <link rel='stylesheet' type='text/css' href='stylesheet.css'/>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="script.js"></script>
</head>
于 2013-05-17T07:07:27.483 に答える