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 ui sortable拖拽后保存位置
Apr 27 jQuery
jQuery序列化后的表单值转换成Json
Jun 16 jQuery
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
Jun 26 jQuery
jQuery事件_动力节点Java学院整理
Jul 05 jQuery
jQuery上传插件webupload使用方法
Aug 01 jQuery
jQuery图片缩放插件smartZoom使用实例详解
Aug 25 jQuery
jQuery动态添加.active 实现导航效果代码思路详解
Aug 29 jQuery
jQuery实现的页面遮罩层功能示例【测试可用】
Oct 14 jQuery
JS文件中加载jquery.js的实例代码
May 05 jQuery
jQuery实现form表单基于ajax无刷新提交方法实例代码
Nov 04 jQuery
如何解决jQuery 和其他JS库的冲突
Jun 22 jQuery
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
Nov 09 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
德劲1102收音机的打理维修案例
2021/03/02 无线电
PHP中simplexml_load_string函数使用说明
2011/01/01 PHP
PHP 安全检测代码片段(分享)
2013/07/05 PHP
两级联动select刷新后其值保持不变的实现方法
2014/01/27 PHP
thinkphp循环结构用法实例
2014/11/24 PHP
PHP培训要多少钱
2017/06/06 PHP
php抽象类和接口知识点整理总结
2019/08/02 PHP
JavaScript中实现块作用域的方法
2010/04/01 Javascript
在JavaScript中监听IME键盘输入事件
2011/05/29 Javascript
JS 控件事件小结
2012/10/31 Javascript
javascript自动改变文字大小和颜色的效果的小例子
2013/08/02 Javascript
更靠谱的H5横竖屏检测方法(js代码)
2016/09/13 Javascript
Bootstrap table右键功能实现方法
2017/02/20 Javascript
jQuery控制元素隐藏和显示
2017/03/03 Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
2017/04/01 Javascript
JavaScript在控件上添加倒计时功能的实现代码
2017/07/04 Javascript
Vue.js实现列表清单的操作方法
2017/11/15 Javascript
JS打印彩色菱形的实例代码
2018/08/15 Javascript
解决Vue-cli npm run build生产环境打包,本地不能打开的问题
2018/09/20 Javascript
vue cli3.0结合echarts3.0与地图的使用方法示例
2019/03/26 Javascript
webpack打包优化的几个方法总结
2020/02/10 Javascript
从Node.js事件触发器到Vue自定义事件的深入讲解
2020/06/26 Javascript
vue 使用lodash实现对象数组深拷贝操作
2020/09/10 Javascript
vue中可编辑树状表格的实现代码
2020/10/31 Javascript
Django与遗留的数据库整合的方法指南
2015/07/24 Python
Python中元组,列表,字典的区别
2017/05/21 Python
python通过TimedRotatingFileHandler按时间切割日志
2019/07/17 Python
python3注册全局热键的实现
2020/03/22 Python
.img/.hdr格式转.nii格式的操作
2020/07/01 Python
python re的findall和finditer的区别详解
2020/11/15 Python
7 For All Mankind官网:美国加州洛杉矶的高级牛仔服装品牌
2018/12/20 全球购物
公司企业表扬信
2014/01/11 职场文书
军训自我鉴定怎么写
2014/02/13 职场文书
我爱读书演讲稿
2014/05/07 职场文书
建议书的格式
2014/05/12 职场文书
医学生自荐信范文(2016精选篇)
2016/01/28 职场文书