-1

Firefox、IE、および Chrome で試しましたが、次のコードではアラートが発生しません。ページロード時または画像をクリックしたときのいずれかです。私は JavaScript に非常に慣れていませんが、ユーザー エクスペリエンスに関して JavaScript が持つ力に本当に感謝しています。私は本当にそれをもっとよく学びたいと思っています.うまくいけば、あなたの誰かが私がこれがうまくいかない理由を理解するのを助けることができるでしょう.私は完全なHTMLを含めます。セレクターと DOM オブジェクトに。また、javascriptでエラーを適切にスローする方法もわかりません... :(

<html> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<script type="text/javascript">
function preview(img, selection) { 
alert("firedTwo");

} 

$(document).ready(function () { 
alert("firedThree");
}); 

$(window).load(function () { 
alert("fired");
});

</script>

<link href="../css/style.css" rel="stylesheet" type="text/css" />
<link href="../css/profile.css" rel="stylesheet" type="text/css" />

<link rel="shortcut icon" href="favicon.ico" >
<link rel="apple-touch-icon" href="apple-touch-icon.png" >


<title>CityGuru.ca - Saskatoon: Profile Editor</title>

</head> 

<body>

<h1>Profile Picture Upload</h1>

<div id="subHeader">Upload Picture</div>
<div id="subContainer">
        <h2>Create Thumbnail</h2>
        <div align="center">
            <img src="../images/users/saskatoon/1/photo.jpg" style="float: left; margin-right: 10px;" id="thumbnail" alt="Create Thumbnail" />
            <div style="border:1px #e5e5e5 solid; float:left; position:relative; overflow:hidden; width:60px; height:60px;">
                <img src="../images/users/saskatoon/1/photo.jpg" style="position: relative;" alt="Thumbnail Preview" />
            </div>
            <br style="clear:both;"/>
            <form name="thumbnail" action="http://saskatoon.CityGuru.ca/includes/profileEditor.php?action=picUpload" method="post">
                <input type="hidden" name="x1" value="" id="x1" />
                <input type="hidden" name="y1" value="" id="y1" />
                <input type="hidden" name="x2" value="" id="x2" />
                <input type="hidden" name="y2" value="" id="y2" />
                <input type="hidden" name="w" value="" id="w" />
                <input type="hidden" name="h" value="" id="h" />
                <input type="submit" name="upload_thumbnail" value="Save Thumbnail" id="save_thumb" />
            </form>
        </div>
    <hr />
        <h2>Upload Photo</h2>
    <form name="photo" enctype="multipart/form-data" action="http://saskatoon.CityGuru.ca/includes/profileEditor.php?action=picUpload" method="post">
    Photo <input type="file" name="image" size="30" /> <input type="submit" name="upload" value="Upload" />
    </form>
</div>   



</body>
</html> 

: FireFox の Web コンソールを使用している場合、表示される唯一の JS エラーは$ is not defined

4

4 に答える 4

1

このhttp://code.jquery.com/jquery-latest.jsを head セクションのスクリプト タグに追加します。上記のコードには jquery がないため、 $(document.ready(function()) は機能しません

于 2012-05-12T17:45:58.620 に答える
1

次のようにしてみてください。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html> 

<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
function preview(img, selection) { 
 alert("firedTwo");

} 
...

</head> 

注意すべき重要事項:

  1. jQuery が参照されていません:<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
  2. あなたは物事を乱雑に並べます...
于 2012-05-12T17:58:06.603 に答える
1

$() 構文は jQuery であり、ネイティブの JavaScript ではありません。(ただし、他の一部のライブラリもこれと同じ構文を使用します)。これを機能させるには、jQuery を含める必要があります。

于 2012-05-12T17:53:22.173 に答える
0

まず、このようなスクリプトは通常頭の中にあります。

次に、JavaScript を doctype の前に置くべきではありません。

3 番目に、開始タグが表示されず、終了タグのみが表示されます。

最後に、ヘッドのどこかに jquery スクリプトを含める必要があります。

于 2012-05-12T17:44:38.807 に答える