jQuery复合事件用法示例

2019-11-19 16:22:25

字体：大中小

来源：转载

供稿：网友

本文实例讲述了jQuery复合事件用法。分享给大家供大家参考，具体如下：

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>复合事件</title>  <style type="text/css" >    a{      color:#000;      text-decoration:none;    }    ul{      list-style:none;    }    ul li{      width:140px;    }    #menu_1{      border:1px dotted #666;      border-top:none;      padding:0px 5px 5px 5px;    }    #menu_1 li{      margin: 5px 0px;    }    li.fli{      display:block;      float:left;      padding:0px 10px;    }  </style>  <script src="js/jquery-1.8.3.js" type="text/javascript"></script>  <script language="JavaScript">    $(document).ready(function () {      $("#myaccound").hover(          function () {            $("#menu_1").css("display","block");          },          function () {            $("#menu_1").css("display","none");          });    });  </script></head><body><div id="nav">  <ul>    <li class="fli"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我的订单</a></li>    <li class="fli" id="myaccound">      <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我的宜美惠</a>      <ul id="menu_1" style="display:none;">        <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我的优惠券</a></li>        <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >收藏夹</a></li>        <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >短信息</a></li>      </ul>    </li>    <li class="fli"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我网站导航</a></li>  </ul></div></body></html>

运行效果图如下：