JavaScript 鼠标事件

onmouse事件用于定义使用鼠标的操作。

JavaScript 中的 onmouse 事件是：

• onmouseover 和 onmouseout
• onmouseup 和 onmousedown
• onmouseenter 和 onmouseleave

1. onmouseover 和 onmouseout：

   当鼠标光标放在特定元素上时会发生 onmouseover 和 onmouseout 事件

   这些事件不需要鼠标点击发生

     
       
        function over()
         {
           document.getElementById('key').innerHTML=
   "Onmouseover event has occured";
         }
         function out()
         {
           document.getElementById('key').innerHTML=
   "Onmouseout event has occured";
         }
       
     
     
       
          Original Text
     

   输出：

   在加载网页时：

   

   将鼠标放在元素上后：

   

   从元素中删除鼠标后：

   

2. onmouseup 和 onmousedown：

   遇到鼠标单击时会发生这些事件

      
        
         function up()
          {
            document.getElementById("img").src="up.png";
          }
         function down()
          {
            document.getElementById("img").src = "down.png";
          }
        
     
     
       
     

   输出：

   在加载网页时：

   

   onmousedown 事件的发生：

   

   onmouseup 事件的发生：

   

3. onmouseenter 和 onmouseleave

   onmouseenter 事件在鼠标放在元素上时发生，并一直持续到鼠标从元素上移开

   onmouseleave 事件在鼠标从元素上移开后立即发生

   这些事件不需要鼠标点击发生

      
       
         function enter()
          {
            document.getElementById(
   "img").src="enter.png";
          }
         function leave()
         {
           document.getElementById(
   "img").src = "leave.png";
          }
       
     
      
        
      

   输出：

   在加载网页时：

   

   onmouseenter 事件的发生：

   

   onmouseleave 事件的发生：