JavaScript無法在鼠標懸停時運行
[英]JavaScript does not run for mouseover
問題描述
為什么下面的腳本似乎沒有運行？ 我還想對如何調試JavaScript提出一些建議。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#clickable_div {
width:100px;
height:50px;
background-color:#9c9c9c;
}
* {
margin:0;
padding:0
}
#nav_menu {
width:100px;
height:auto;
background-color:#CCC;
display:none;
}
#wrap {
width:100px
}
</style>
<script src="js/jquery.js"></script>
<SCRIPT LANGUAGE="JAVASCRIPT">
$('#clickable_div').mouseover( function(){
$('#nav_menu').slideDown();})
$('#wrap').mouseleave( function(){
$('#nav_menu').slideUp();});
</script>
<div id='wrap'>
<div id="clickable_div">MENU</div>
<div id="nav_menu">
<ul>
<li id="l1">AAAAA</li>
<li>BBBBB</li>
<li>CCCCC</li>
<li>DDDDD</li>
</ul>
</div>
</div>
</div>
</head>
<body>
</body>
</html>
3 個解決方案
解決方案1
0 已采納 2013-07-07 20:07:41
除了將HTML放入頁面主體之外，您還需要等待頁面准備就緒。
<script>
$(function(){
$('#clickable_div').mouseover( function(){
$('#nav_menu').slideDown();})
$('#wrap').mouseleave( function(){
$('#nav_menu').slideUp();}
);
});
</script>
解決方案2
0
在DOM准備就緒之前，您的腳本正在執行。 您需要等到DOM可用后才能嘗試對其進行操作。
將腳本更改為：
$(document).ready(function() {
$('#clickable_div').mouseover( function(){
$('#nav_menu').slideDown();})
$('#wrap').mouseleave( function(){
$('#nav_menu').slideUp();});
});
解決方案3
0 2013-07-07 20:15:04
您可以使用Chrome輕松調試JavaScript代碼，請參閱調試JavaScript 。
JavaScript元素在鼠標懸停時不顯示
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.