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 Form插件使用详解_动力节点Java学院整理
Jul 17 jQuery
使用vue与jquery实时监听用户输入状态的操作代码
Sep 19 jQuery
jQuery简单实现向列表动态添加新元素的方法示例
Dec 25 jQuery
使用jQuery 操作table 完成单元格合并的实例
Dec 27 jQuery
jquery 输入框查找关键字并提亮颜色的实例代码
Jan 23 jQuery
jQuery实现checkbox全选功能完整实例
Jul 12 jQuery
jQuery实现的卷帘门滑入滑出效果【案例】
Feb 18 jQuery
详解jQuery设置内容和属性
Apr 11 jQuery
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 jQuery
jquery UI实现autocomplete在获取焦点时得到显示列表功能示例
Jun 04 jQuery
JavaScript表格隔行变色和Tab标签页特效示例【附jQuery版】
Jul 11 jQuery
非常实用的jQuery代码段集锦【检测浏览器、滚动、复制、淡入淡出等】
Aug 08 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
phplock(php进程锁) v1.0 beta1
2009/11/24 PHP
php学习笔记 面向对象的构造与析构方法
2011/06/13 PHP
PHP中VC6、VC9、TS、NTS版本的区别与用法详解
2013/10/26 PHP
双冒号 ::在PHP中的使用情况
2015/11/05 PHP
PHP在linux上执行外部命令的方法
2017/02/06 PHP
excel操作之Add Data to a Spreadsheet Cell
2007/06/12 Javascript
IE/FireFox具备兼容性的拖动代码
2007/08/13 Javascript
使用JQuery进行跨域请求
2010/01/25 Javascript
javaScript 利用闭包模拟对象的私有属性
2011/12/29 Javascript
js控制input框只读实现示例
2014/01/20 Javascript
Javascript浮点数乘积运算出现多位小数的解决方法
2014/02/17 Javascript
浅析javascript操作 cookie对象
2014/12/26 Javascript
js打造数组转json函数
2015/01/14 Javascript
Bootstrap Metronic完全响应式管理模板之菜单栏学习笔记
2016/07/08 Javascript
详细探究ES6之Proxy代理
2016/07/22 Javascript
JS+Canvas实现的俄罗斯方块游戏完整实例
2016/12/12 Javascript
jQuery实现复选框的全选和反选
2017/02/02 Javascript
BootStrap的双日历时间控件使用
2017/07/25 Javascript
JS手机端touch事件计算滑动距离的方法示例
2017/10/26 Javascript
浅探express路由和中间件的实现
2019/09/30 Javascript
[38:54]完美世界DOTA2联赛PWL S2 Rebirth vs LBZS 第一场 11.28
2020/12/01 DOTA
[01:19:33]DOTA2-DPC中国联赛 正赛 iG vs VG BO3 第一场 2月2日
2021/03/11 DOTA
tensorflow中next_batch的具体使用
2018/02/02 Python
Python变量赋值的秘密分享
2018/04/03 Python
python对html过滤处理的方法
2018/10/21 Python
python引用(import)某个模块提示没找到对应模块的解决方法
2019/01/19 Python
python实现坦克大战游戏 附详细注释
2020/03/27 Python
Python多线程threading模块用法实例分析
2019/05/22 Python
德国在线香料制造商:Gewürzland
2020/03/10 全球购物
.net面试题
2015/12/22 面试题
公司新年寄语
2014/04/04 职场文书
酒店节能降耗方案
2014/05/08 职场文书
2014年辅导员工作总结
2014/11/18 职场文书
《走遍天下书为侣》教学反思
2016/02/22 职场文书
导游词之凤凰古城
2019/10/22 职场文书
python数据分析之单因素分析线性拟合及地理编码
2022/06/25 Python