anc*_*evv 1 html javascript jquery
当我保持我的javascript/jquery外部时,我的代码不起作用.但是当我在我的html文件中将它们组合时,一切都很好.
有什么建议吗?
这是代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type ="text/javascript" src="jquery.js"></script>
<script type ="text/javascript" src="program.js"></script>
</head>
<body>
<div id="clickme">
Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123" />
<p>First Paragraph</p>
<p>Second Paragraph</p>
<p>Yet one more Paragraph</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
与外部JavaScript
$('#clickme').click(function() {
$('#book').fadeOut('slow', function() {
// Animation complete.
});
});
$("p").click(function () {
$(this).slideUp();
});
Run Code Online (Sandbox Code Playgroud)
与
<!DOCTYPE html>
<html>
<head>
<script type ="text/javascript" src="jquery.js"></script>
</head>
<body>
<div id="clickme">
Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123" />
<p>First Paragraph</p>
<p>Second Paragraph</p>
<p>Yet one more Paragraph</p>
<script>
$('#clickme').click(function() {
$('#book').fadeOut('slow', function() {
// Animation complete.
});
});
$("p").click(function () {
$(this).slideUp();
});
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
Shy*_*yju 13
我猜你在DOM完成加载之前执行click事件.将代码包装在dom ready事件中,它应该可以工作,假设你的外部javascript文件的路径是正确的.
$(function(){
$('#clickme').click(function() {
$('#book').fadeOut('slow', function() {
// Animation complete.
});
});
$("p").click(function () {
$(this).slideUp();
});
});
Run Code Online (Sandbox Code Playgroud)
如果遇到任何脚本错误,请始终使用firebug(控制台)查看脚本有什么问题.
您的javascript在页面上有元素之前执行.您可以通过使用$(document).ready(function(){...});或移动外部JavaScript文件到底部来解决这个问题.
将您的 js 代码包装在外部文件中
$(document).ready(function(){
//your code goes here
});
Run Code Online (Sandbox Code Playgroud)
现在,您在标头中包含外部 js 文件并执行它。此时没有元素 so$('#clickme')并且$("p")是空集。在第二个示例中,您在使用该元素呈现 html 后运行此代码。
| 归档时间: |
|
| 查看次数: |
10822 次 |
| 最近记录: |