jQuery复合事件用法示例

本文实例讲述了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>

运行效果图如下：

PS：这里再附上javascript常见事件与功能说明的在线对照表供大家参考：

javascript事件与功能说明大全：
http://tools./table/javascript_event

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

# jQuery # 复合事件 # jQuery中复合属性选择器用法实例 # jQuery 复合选择器应用的几个例子 # jquery中的常用事件bind、hover、toggle等示例介绍 # jquery中交替点击事件toggle方法的使用示例 # JQuery入门——事件切换之toggle()方法应用介绍 # jQuery事件绑定.on()简要概述及应用 # jQuery给动态添加的元素绑定事件的方法 # jquery键盘事件使用介绍 # jQuery事件 delegate()使用方法介绍 # jquery 回车事件实现代码 # jQuery复合事件结合toggle()方法的用法示例 # 相关内容 # 感兴趣 # 收藏夹 # 给大家 # 更多关于 # 短信息 # 所述 # 程序设计 # 网站导航 # 对照表 # 选择器 # 讲述了 # ul # decoration # li # list # text # type # color # css

返回目录在线咨询

上一篇：Go语言中通道与接口的类型兼容性：深入理解与实践
下一篇：合肥网站建设新趋势：创新设计与用户体验优化

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

全网整合营销服务商

jQuery复合事件用法示例

您的项目需求