jquery的问题

Question

 <script type="text/javascript">
$(document).ready(function(){
 
  $("#xu001").hide();
  $("#xu002").hide();
  $("#xu003").hide();
  $("#xu004").hide();
  $("#xu005").hide();
  $("#xu006").hide();
  
 
});
$(document).ready(function(){
  $("#xf1").hover(function(){
  $("#xu001").fadeTo("slow", 1); 
  });
  $("#xf1").mouseleave(function(){
  $("#xu001").fadeTo("fast", 0); 
  });
  
});
$(document).ready(function(){
  $("#xf2").hover(function(){
  $("#xu002").fadeTo("slow", 1); 
  });
  $("#xf2").mouseleave(function(){
  $("#xu002").fadeTo("fast", 0); 
  });
  
});
$(document).ready(function(){
  $("#xf3").hover(function(){
  $("#xu003").fadeTo("slow", 1); 
  });
  $("#xf3").mouseleave(function(){
  $("#xu003").fadeTo("fast", 0); 
  });
  
});
$(document).ready(function(){
  $("#xf4").hover(function(){
  $("#xu004").fadeTo("slow", 1); 
  });
  $("#xf4").mouseleave(function(){
  $("#xu004").fadeTo("fast", 0); 
  });
  
});
$(document).ready(function(){
  $("#xf5").hover(function(){
  $("#xu005").fadeTo("slow", 1); 
  });
  $("#xf5").mouseleave(function(){
  $("#xu005").fadeTo("fast", 0); 
  });
  $(document).ready(function(){
  $("#xf6").hover(function(){
  $("#xu006").fadeTo("slow", 1); 
  });
  $("#xf6").mouseleave(function(){
  $("#xu006").fadeTo("fast", 0); 
  });
  
});
  
});</script>
为什么上面的代码只执行一次就不执行就了 就是我鼠标悬浮上面 图片放大  第一次可以 第二次就不行了

Answer 1

$(document).ready(function(){}
可以放在一个$(document).ready里边的，没必要使用多个

Answer 2

$(document).ready( function() {
    $("#xf1").mouseover( function() {
        $("#xu001").fadeTo("slow", 1);
    }).mouseout( function() { $("#xu001").fadeTo("fast", 0); });
    $("#xf2").mouseover( function() {
        $("#xu002").fadeTo("slow", 1);
    }).mouseout( function() { $("#xu002").fadeTo("fast", 0); });
});

Answer 3

在一个JS文件中不要出现一个以上的$(document).ready(function(){});

Answer 4

用JQ了，代码还写得这么罗索。用JQ了就应该学习它的思想，不要拿最新型的枪械当烧火棍使。

Answer 5

怎么这么多ready function~~~ 一个就够了$(document).ready( function() {
    $("#xf1").mouseover( function() {
        $("#xu001").fadeTo("slow", 1);
    }).mouseout( function() { $("#xu001").fadeTo("fast", 0); });
    $("#xf2").mouseover( function() {
        $("#xu002").fadeTo("slow", 1);
    }).mouseout( function() { $("#xu002").fadeTo("fast", 0); });
});