jQuery复合事件用法示例


Posted in jQuery onJune 10, 2017

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

运行效果图如下:

jQuery复合事件用法示例

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

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

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

jQuery 相关文章推荐
jquery基于layui实现二级联动下拉选择(省份城市选择)
Jun 20 jQuery
jQuery菜单实例(全选,反选,取消)
Aug 28 jQuery
JQuery 获取多个select标签option的text内容(实例)
Sep 07 jQuery
bootstrap+jquery项目引入文件报错的解决方法
Jan 22 jQuery
jquery拖拽自动排序插件使用方法详解
Jul 20 jQuery
JQuery事件委托原理与用法实例分析
May 13 jQuery
layui+jquery支持IE8的表格分页方法
Sep 28 jQuery
jQuery实现轮播图效果
Nov 26 jQuery
jQuery实现二级导航菜单的示例
Sep 30 jQuery
jQuery实现计算器功能
Oct 19 jQuery
JavaScript枚举选择jquery插件代码实例
Nov 17 jQuery
ajax jquery实现页面某一个div的刷新效果
Mar 04 jQuery
jQuery简单绑定单个事件的方法示例
Jun 10 #jQuery
jQuery正则验证注册页面经典实例
Jun 10 #jQuery
JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理)
Jun 09 #jQuery
JQuery.dataTables表格插件添加跳转到指定页
Jun 09 #jQuery
jQuery为某个div加入行样式
Jun 09 #jQuery
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
Jun 09 #jQuery
jQuery Validate表单验证插件实现代码
Jun 08 #jQuery
You might like
请php正则走开
2008/03/15 PHP
解析PHP高效率写法(详解原因)
2013/06/20 PHP
详解PHP对数组的定义以及数组的创建方法
2015/11/27 PHP
在第一个input框内输入内容.textarea自动得到第一个文件框的值的javascript代码
2007/04/20 Javascript
js图片滚动效果时间可随意设定当鼠标移上去时停止
2014/06/26 Javascript
javascript实现在网页任意处点左键弹出隐藏菜单的方法
2015/05/13 Javascript
Angularjs2不同组件间的通信实例代码
2017/05/06 Javascript
js获取文件里面的所有文件名(实例)
2017/10/17 Javascript
基于vue展开收起动画的示例代码
2018/07/05 Javascript
详解在vue-test-utils中mock全局对象
2018/11/07 Javascript
Vue.js 使用v-cloak后仍显示变量的解决方法
2018/11/19 Javascript
react+ant design实现Table的增、删、改的示例代码
2018/12/27 Javascript
VUE 实现复制内容到剪贴板的两种方法
2019/04/24 Javascript
小程序实现背景音乐播放和暂停
2020/06/19 Javascript
JavaScript this指向相关原理及实例解析
2020/07/10 Javascript
[01:05:12]2014 DOTA2国际邀请赛中国区预选赛 TongFu VS CIS-GAME
2014/05/21 DOTA
[00:27]DOTA2次级职业联赛 - Lilith战队宣传片
2014/12/01 DOTA
Python创建日历实例
2014/08/21 Python
Python实用日期时间处理方法汇总
2015/05/09 Python
详解Python中映射类型(字典)操作符的概念和使用
2015/08/19 Python
Using Django with GAE Python 后台抓取多个网站的页面全文
2016/02/17 Python
Python使用cx_Freeze库生成msi格式安装文件的方法
2018/07/10 Python
opencv python 基于KNN的手写体识别的实例
2018/08/03 Python
python3 中文乱码与默认编码格式设定方法
2018/10/31 Python
python+selenium实现简历自动刷新的示例代码
2019/05/20 Python
使用python 写一个静态服务(实战)
2019/06/28 Python
Django基础知识 URL路由系统详解
2019/07/18 Python
使用python和pygame制作挡板弹球游戏
2019/12/03 Python
CSS3混合模式mix-blend-mode/background-blend-mode简介
2018/03/15 HTML / CSS
护士自荐信
2013/10/25 职场文书
宣传策划类求职信范文
2014/01/31 职场文书
先进班集体事迹材料
2014/12/25 职场文书
起诉状范本
2015/05/20 职场文书
结婚十年感言
2015/07/31 职场文书
学习计划是什么
2019/04/30 职场文书
在redisCluster中模糊获取key方式
2021/07/09 Redis