umgsai
umgsai

CSS+JS实现兼容性很好的无限级下拉菜单

 
 
    

  
  
  1. <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    2. 

  
  
  2. <htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="en">
    3. 

  
  
  3. <head>
    4. 

  
  
  4. <title>CSS+JS实现兼容性很好的无限级下拉菜单</title>
    5. 

  
  
  5. <styletype="text/css">
    6. 

  
  
  6. *{margin:0;padding:0;border:0;}
    7. 

  
  
  7. body{font:12px/130%verdana,geneva,arial,helvetica,sans-serif,宋体;}li{list-style:none;}
    8. 

  
  
  8. .clearfix:after{content:"";display:block;height:0;clear:both;visibility:hidden;}.clearfix{display:inline-block;}
    9. 

  
  
  9. a:link{color:#000;text-decoration:none;}
    10. 

  
  
  10. a:visited{color:#000;text-decoration:none;}
    11. 

  
  
  11. a:hover{color:#000;text-decoration:none;}
    12. 

  
  
  12. .menu{width:778px;height:26px;background:#fff;margin:0auto;}
    13. 

  
  
  13. .menusel{float:left;width:100px;position:relative;height:25px;background:#ddd;line-height:25px;margin-left:1px;*margin-left:0px;_margin-left:-1px;}
    14. 

  
  
  14. .menuselh2{font-size:12px;}
    15. 

  
  
  15. .menusela{display:block;text-align:center;width:100px;border:1pxsolid#a4a4a4;height:25px;border-bottom:1pxsolid#a4a4a4;position:relative;z-index:2;}
    16. 

  
  
  16. .menusela:hover{border:1pxsolid#a4a4a4;border-bottom:1pxdashed#eeeeee;position:relative;z-index:2;height:25px;}
    17. 

  
  
  17. .ahovera{border-bottom:1pxdashed#eeeeee;background:#eeeeee;}
    18. 

  
  
  18. .position{position:absolute;z-index:1;}
    19. 

  
  
  19. .menuselul{width:125px;background:#eee;border:1pxsolid#a4a4a4;margin-top:-1px;position:relative;z-index:1;display:none;}
    20. 

  
  
  20. .menusel.block{display:block;}
    21. 

  
  
  21. .typeulli{border-bottom:1pxdashed#a4a4a4;width:125px;position:relative;float:left;}
    22. 

  
  
  22. .typeullia{border:none;width:125px;}
    23. 

  
  
  23. .typeullia:hover{border:none;background:#ddd;}
    24. 

  
  
  24. .typeul{margin-left:0;}
    25. 

  
  
  25. .typeulul{left:125px;top:0;position:absolute;}
    26. 

  
  
  26. .fli{margin-left:-1px;border-left:#eeeeeesolid1px;}
    27. 

  
  
  27. .menusel.lli{border:none;}
    28. 

  
  
  28. </style>
    29. 

  
  
  29. <scripttype="text/javascript">document.execCommand("BackgroundImageCache",false,true);</script><!--IE6背景图片闪烁问题-->
    30. 

  
  
  30. </head>
    31. 

  
  
  31. <body>
    32. 

  
  
  32. <divclass="menu">
    33. 

  
  
  33. <divid="menu1"class="menusel">
    34. 

  
  
  34. <h2><ahref="/">菜单1</a></h2>
    35. 

  
  
  35. <divclass="position">
    36. 

  
  
  36. <ulclass="clearfixtypeul">
    37. 

  
  
  37. <li><ahref="http://www.33567.cn">菜单选项1-2</a></li>
    38. 

  
  
  38. <li>
    39. 

  
  
  39. <ahref="#">菜单选项1-2</a>
    40. 

  
  
  40. <ul>
    41. 

  
  
  41. <liclass="fli"><ahref="#">菜单选项1-2-1</a></li>
    42. 

  
  
  42. <liclass="lli"><ahref="#">菜单选项1-2-2</a></li>
    43. 

  
  
  43. </ul>
    44. 

  
  
  44. </li>
    45. 

  
  
  45. <li><ahref="http://www.7caidy.com">菜单选项1-2</a></li>
    46. 

  
  
  46. <liclass="lli"><ahref="#">菜单选项1-2</a></li>
    47. 

  
  
  47. </ul>
    48. 

  
  
  48. </div><!--position-->
    49. 

  
  
  49. </div><!--menusel-->
    50. 

  
  
  50. <divid="menu2"class="menusel">
    51. 

  
  
  51. <h2><ahref="#">菜单2</a></h2>
    52. 

  
  
  52. <divclass="position">
    53. 

  
  
  53. <ulclass="clearfixtypeul">
    54. 

  
  
  54. <li><ahref="#">菜单选项2-2</a></li>
    55. 

  
  
  55. <li><ahref="#">菜单选项2-2</a>
    56. 

  
  
  56. <ul>
    57. 

  
  
  57. <liclass="fli"><ahref="#">菜单选项2-2-1</a></li>
    58. 

  
  
  58. <liclass="lli"><ahref="#">菜单选项2-2-2</a>
    59. 

  
  
  59. <ul>
    60. 

  
  
  60. <liclass="fli"><ahref="#">菜单选项2-2-1</a></li>
    61. 

  
  
  61. <liclass="lli"><ahref="#">菜单选项2-2-2</a>
    62. 

  
  
  62. </li>
    63. 

  
  
  63. </ul>
    64. 

  
  
  64. </li>
    65. 

  
  
  65. </ul>
    66. 

  
  
  66. </li>
    67. 

  
  
  67. <li><ahref="#">菜单选项2-2</a></li>
    68. 

  
  
  68. <liclass="lli"><ahref="#">菜单选项2-2</a></li>
    69. 

  
  
  69. </ul>
    70. 

  
  
  70. </div><!--position-->
    71. 

  
  
  71. </div><!--menusel-->
    72. 

  
  
  72. <divid="menu3"class="menusel">
    73. 

  
  
  73. <h2><ahref="#">菜单3</a></h2>
    74. 

  
  
  74. <divclass="position">
    75. 

  
  
  75. <ulclass="clearfixtypeul">
    76. 

  
  
  76. <li><ahref="#">菜单选项3-2</a></li>
    77. 

  
  
  77. <li><ahref="#">菜单选项3-2</a>
    78. 

  
  
  78. <ul>
    79. 

  
  
  79. <liclass="fli"><ahref="#">菜单选项3-2-1</a></li>
    80. 

  
  
  80. <liclass="lli"><ahref="#">菜单选项3-2-2</a>
    81. 

  
  
  81. <ul>
    82. 

  
  
  82. <liclass="fli"><ahref="#">菜单选项3-2-1</a></li>
    83. 

  
  
  83. <liclass="lli"><ahref="#">菜单选项3-2-2</a>
    84. 

  
  
  84. <ul>
    85. 

  
  
  85. <liclass="fli"><ahref="#">菜单选项3-2-1</a></li>
    86. 

  
  
  86. <liclass="lli"><ahref="#">菜单选项3-2-2</a></li>
    87. 

  
  
  87. </ul>
    88. 

  
  
  88. </li>
    89. 

  
  
  89. </ul>
    90. 

  
  
  90. </li>
    91. 

  
  
  91. </ul>
    92. 

  
  
  92. </li>
    93. 

  
  
  93. <li><ahref="#">菜单选项3-2</a></li>
    94. 

  
  
  94. <liclass="lli"><ahref="#">菜单选项3-2</a></li>
    95. 

  
  
  95. </ul>
    96. 

  
  
  96. </div><!--position-->
    97. 

  
  
  97. </div><!--menusel-->
    98. 

  
  
  98. </div><!--menu-->
    99. 

  
  
  99. <scripttype="text/javascript">
    100. 

  
  
  100. for(varx=1;x<4;x++)
    101. 

  
  
  101. {
    102. 

  
  
  102. varmenuid=document.getElementById("menu"+x);
    103. 

  
  
  103. menuid.num=x;
    104. 

  
  
  104. type();
    105. 

  
  
  105. }
    106. 

  
  
  106. functiontype()
    107. 

  
  
  107. {
    108. 

  
  
  108. varmenuh2=menuid.getElementsByTagName("h2");
    109. 

  
  
  109. varmenuul=menuid.getElementsByTagName("ul");
    110. 

  
  
  110. varmenuli=menuul[0].getElementsByTagName("li");
    111. 

  
  
  111. menuh2[0].onmouseover=show;
    112. 

  
  
  112. menuh2[0].onmouseout=unshow;
    113. 

  
  
  113. menuul[0].onmouseover=show;
    114. 

  
  
  114. menuul[0].onmouseout=unshow;
    115. 

  
  
  115. functionshow()
    116. 

  
  
  116. {
    117. 

  
  
  117. menuul[0].className="clearfixtypeulblock"
    118. 

  
  
  118. }
    119. 

  
  
  119. functionunshow()
    120. 

  
  
  120. {
    121. 

  
  
  121. menuul[0].className="typeul"
    122. 

  
  
  122. }
    123. 

  
  
  123. for(vari=0;i<menuli.length;i++)
    124. 

  
  
  124. {
    125. 

  
  
  125. menuli[i].num=i;
    126. 

  
  
  126. varliul=menuli[i].getElementsByTagName("ul")[0];
    127. 

  
  
  127. if(liul)
    128. 

  
  
  128. {
    129. 

  
  
  129. typeshow()
    130. 

  
  
  130. }
    131. 

  
  
  131. }
    132. 

  
  
  132. functiontypeshow()
    133. 

  
  
  133. {
    134. 

  
  
  134. menuli[i].onmouseover=showul;
    135. 

  
  
  135. menuli[i].onmouseout=unshowul;
    136. 

  
  
  136. }
    137. 

  
  
  137. functionshowul()
    138. 

  
  
  138. {
    139. 

  
  
  139. menuli[this.num].getElementsByTagName("ul")[0].className="block";
    140. 

  
  
  140. }
    141. 

  
  
  141. functionunshowul()
    142. 

  
  
  142. {
    143. 

  
  
  143. menuli[this.num].getElementsByTagName("ul")[0].className="";
    144. 

  
  
  144. }
    145. 

  
  
  145. }
    146. 

  
  
  146. </script>
    147. 

  
  
  147. </body>
    148. 

  
  
  148. </html>
    149. 

  
  
  149.  
    CSS+JS实现兼容性很好的无限级下拉菜单_第1张图片
     
    150.

本文出自 “阿凡达” 博客，请务必保留此出处http://shamrock.blog.51cto.com/2079212/815559

你可能感兴趣的:(下拉菜单)

  • mac 备份android 手机通讯录导入iphone,iphone如何导出通讯录（轻松教你iPhone备份通讯录的方法）... weixin_39762838 mac备份android手机通讯录导入iphone
    在日新月异的手机更替中，换手机已经成为一个非常稀松平常的事情，但将旧手机上面的通讯录导入到新手机还是让不少小伙伴为难，本篇将给大家详细讲解这方面的知识：“苹果手机通讯录怎么导入到新手机”及“安卓手机通讯录导入到新手机”的方法。一、苹果手机通讯录导入到新手机常用方法(SIM卡导入)在苹果手机主频幕上找到“设置”，单击进入设置菜单，下拉菜单列表，点击“邮件、通讯录、日历”，然后找到“导入SIM卡通讯录
  • 关闭Windows自动更新的6种方法 Gemini1995 windows
    在Windows操作系统中，可以使用多种方法来关闭自动更新。以下是其中一些常用的方法：使用设置应用：打开“设置”应用（Win+I），选择“更新和安全”。在左侧菜单中选择“Windows更新”。点击“更改活动时间”或“高级选项”。在“更新选项”下拉菜单中选择“通知我但不自动下载或安装”或“从不检查更新”。通过服务管理器：打开“服务”管理器，可以通过在运行对话框中输入services.msc来打开。找
  • 【Python】tkinter及组件如何使用 小九不懂SAP 我的Python日记python开发语言tkinter
    一、tkinter的应用场景tkinter是Python的标准GUI（图形用户界面）库，它提供了丰富的控件和工具，使得开发者能够轻松创建跨平台的桌面应用程序。以下是一些tkinter的常见应用场景：桌面应用程序开发：开发者可以使用tkinter来创建各种桌面应用程序，如文本编辑器、计算器、图片查看器、游戏等。这些应用程序可以具有复杂的用户界面，包括窗口、按钮、文本框、下拉菜单、滚动条等。数据可视化
  • 白嫖Gitee实现远程公告功能和小型文件上传下载 xu-jssy Python自动化脚本gitee
    备注：20240527更新：新增私人令牌下载模式一、准备工作1、打开Gitee网站：Gitee.comhttps://gitee.com/2、获取access_token，用于身份验证登录后点击右上角头像，在下拉菜单中进入个人主页点击左边的个人设置点击左边菜单中的安全设置->私人令牌点击右上角生成新令牌根据提示填写信息，点击提交在弹出的页面复制令牌，注意备份保存3、创建一个仓库用来存放文件可以把远
  • win10配置python_Win 10安装Python及环境变量配置 weixin_39663933 win10配置python
    一、Windows系统很多童鞋问之前的教程怎么没有介绍安装python3.5的，现予以补充更新一下。（一）安装python3.51、下载进入Python官网www.python.org，在“Downloads”下拉菜单中的右半部分直接点击python3.5.2版本即可下载，它会自动下载32位的。如果需要64位，点击左半部分“Windows”，选择第二项“LatestPython3Release-P
  • 如何搭建FTP服务器？ 朝畫夕拾
    FTP服务器可以方便的供用户上传，下载文件，对于我们日常的教学，工作都有着很大的帮助，今天小编就为大家讲解下如何在搭建FTP服务器希望对大家有所帮助。工具/原料电脑一台方法/步骤1首先我们创建一个用户账户用于登录FTP进行操作。右键点击桌面的我的电脑点击选择管理选项，进入管理界面打开本地用户和组选项，我们可以看到列表中的用户选项2然后右键用户选项，在下拉菜单中选择新用户，开始建立我们的用户，填写用
  • 2019-11-17第二个复盘日 孙美丽儿锦华装饰
    今天为第二个复盘日，回听了条件格式、下拉菜单两节课件。函数由于用的比较多，就没有回听，对着课件看了一遍。一、条件格式条件格式的运用，就是当数据达到某一条件时，设置格式。实际运用中，标记身份证号码的重复值。由于身份证号码超过15位，如果前15位号码一致，即使后3位不一致。直接用标记重复值时，也会标记为重复值。在设置公式条件格式时，单元格值用&"*"连接，使其转化为文本就可以了。但是很奇怪，我在文本格
  • 神奇酷炫的下拉菜单 紫藤11
    下拉菜单目前公司的销售报表上，用有这个功能，真心方便，感谢小哈录制的抖音视频，但操作更简单。一、基本用法直接按住Alt+↓即可快速生成,注意：想要实现这样的功能前提是已经输入部分内容二、进阶用法1.提示信息2.出错警告3.圈释无效信息第一次作用圈释无效信息的功能三、动态下拉列表选取数据→定义名称→数据验证→序列→输入=名称四、快速录入当前时间=now（）数据验证设置单元格格式五、借贷只能一方输入选
  • JavaScript基础 不蒸馒头曾口气 Vuejavascript开发语言前端学习笔记
    1JavaScript介绍1.1JS简介1.JavaScript是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。2.作用——网页特效（监听用户的一些行为，让网页作出对应的反馈，如轮播图、下拉菜单等）——表单验证（针对表单数据的合法性进行判断，如输入邮箱的判断）——数据交互（后台的数据，渲染到前端）——服务端编程（node.js）3.JavaScript的组成ECMAScript:(js的
  • latex学习笔记（三）——中文处理办法 richybai
    1.准备工作①，在选项->设置->构建->默认编辑器的下拉菜单中选择XeLaTeX②，在选项->设置->编辑器->默认字体编码的下拉菜单中选择UTF-8③，在软件右下角确定字符编码为UTF-8，如下图所示设置为UTF-82.开始编写中文①，首先导入ctex宏包:\usepackage{ctex}②，将title改为中文内容\title{\heiti学习笔记}%\heiti使中文显示为黑体\auth
  • 【免越狱】iOS任意版本号APP下载 火星技术 ios
    下载地址https://pan.quark.cn/s/570e928ee2c4软件介绍下载iOS旧版应用，简化繁琐的抓包流程。一键生成去更新IPA（手机安装后，去除AppStore的更新检测）。软件界面使用方法一、直接搜索方式搜索APP，双击选择。双击选择要下载的版本。在iTunes中下载即可。二、复制APP链接方式在iTunes下载按钮右侧下拉菜单中，选择【复制链接】。双击选择要下载的版本。在i
  • 使用vue3+ts封装一个自动补全输入框Autocomplete组件 温暖前端 javascript前端vue.js
    创建一个名为Autocomplete.vue的文件，在这个组件中，使用了Vue3的CompositionAPI，包括ref、watch、onMounted等。组件接收placeholder、debounce和clearable作为props，并根据这些props来渲染输入框和下拉菜单{{item}}import{defineComponent,ref,watch,onMounted}from'vu
  • qt自定义下拉菜单框 二氧化矽 qt
    Qt自带的QCombBox下拉能够显示的东西有限，想添加其他的控件不太方便，所以就想自己定义一个，基本思路是，一个QLineEdit，一个QPushButton,一个QListWidget组成一个组合控件。过程：1、将QPushButton嵌入进QLineEdit中。_button->setText("...");_lineEdit->setReadOnly(true);_lineEdit->se
  • MFC工控项目实例之八选择下拉菜单添加打钩图标 兵哥工控 MFC工控项目实例mfcc++
    承接专栏《MFC工控项目实例之七点击下拉菜单弹出对话框》具体添加菜单栏参考我的博客文章《MFC工控项目实例之七点击下拉菜单弹出对话框》这里只给出相关代码1、在SEAL_PRESSUREDlg.h文件中添加代码classCSEAL_PRESSUREDlg:publicCDialog{//Constructionpublic:...CBitmapm_bmSel,m_bmList;voidOnTypeC
  • MFC工控项目实例之六CFile添加菜单栏 兵哥工控 MFC工控项目实例mfcc++
    本程序基于前期我的博客文章《MFC工控项目实例之五CFile类读写系统参数》添加两个对话框如下具体添加菜单栏参考我的博客文章《MFC_CFile类实现下拉菜单读写实例（源码下载）》这里给出相关代码在SEAL_PRESSURE.h文件中添加#include...classCProductPara{public:union{struct{charm_strTypeName[24];charm_strB
  • Vue使用el-cascader 实现多级下拉菜单 孟宪磊mxl vue.jsjavascript前端
    代码：默认click触发子菜单hover触发子菜单exportdefault{data(){return{options:[],father:[{id:1,pid:'0',name:'安徽省',code:'340000',level:1},{id:13,pid:'0',name:'河北省',code:'350000',level:1}],children:[{code:"340800",id:13
  • uniapp 下拉菜单地区和筛选（使用直接改源代码适配） 鹤鸣的日常 uni-app前端java
    地区筛选{{item.name}}0">{{item.name}}0">{{item.name}}重置查看品种{{item.name}}价格区间（元）handleChangePriceMin(e)":value="paramsData.priceMin"class="fillIn-input"placeholder="最低价"/>一handleChangePriceMax(e)":value="p
  • Element-PLUS下拉框、日期组件、下拉菜单定位问题 element-plus下拉框组件定位问题 element-plus日期组件定位问题 头上一片天空 vue.jselement-uielement-plusvuevue.js
    Element-PLUS下拉框、日期组件定位问题element-plus下拉框组件定位问题element-plus日期组件定位问题1、增加全局样式2、使用2.1、下拉框使用2.2、日期组件使用1、增加全局样式.el-popper.is-pure{inset:36pxautoauto0px!important;}2、使用Element-PLUS下拉框、日期、下拉菜单等组件使用的都是Popover，在
  • MAC系统如何设置SOCKS5代理 KookeeyLena7 macos
    在Mac系统上设置SOCKS5代理可以帮助用户提高在线隐私和安全性，或者突破某些网络限制。以下是详细步骤，指导您如何在Mac系统上配置SOCKS5代理。一、打开系统偏好设置在Mac桌面的左上角，点击苹果图标。在下拉菜单中选择“系统偏好设置”。二、进入网络设置在系统偏好设置窗口中，找到并点击“网络”图标。三、选择网络连接方式在网络设置窗口中，您会看到所有的网络连接方式。选择您当前正在使用的网络连接，
  • 【Qt笔记】QToolButton控件详解 冷眼看人间恩怨 Qtqt笔记开发语言QToolButton
    目录一、前言二、QToolButton的基本特性2.1图标和文本2.2自动提升2.3下拉菜单2.4工具提示2.5弹出模式三、高级功能3.1自定义大小与形状3.2检查框与单选按钮3.3动画效果四、常用方法与信号槽常用方法信号槽五、实际应用示例说明六、总结一、前言在Qt框架中，QToolButton是一个非常重要的控件，它提供了快速访问命令或选项的方式。QToolButton通常显示一个图标或文本，当
  • WPS将文字文档朗读 cuisidong1997 wps
    WPS提供了将文字文档转化成语音的功能，还可一键导出音频文件，此功支持手机端和电脑端。分界线.png电脑端的操作如下：▪第一步：用WPS打开文字文档，点击「审阅」选项卡下的「朗读」下拉菜单，可选择「全文朗读」，也可框选文字「选中朗读」。录制_2021_03_24_14_40_06_490.gif▪第二步：点击「朗读」的下拉菜单，选择显示工具栏，此时可以在右侧的朗读工具栏里调整音量、语速、语调等设置
  • Combobox控件 我不是立达刘宁宇 python
    #Combobox控件#通过前面内容的介绍我们知道#Listbox是一个供用户从列表项中选择相应条目的控件#。#但在有些情况下，比如列表的项目过多时，若使用列表控件，列出所有选项就会显得界面格外臃肿，这时就需要用到##Combobox控件，也就是下拉菜单控件（或称复合框），#该控件是列表控件的改进版，具有更加灵活的界面，因此其应用场景相比于前者要更加广泛#不过需要注意的是Combobox并不包含在
  • html按钮的下拉菜单,按钮下拉菜单 weixin_39980929 html按钮的下拉菜单
    按钮下拉菜单仅从外观上看和上一节介绍的下拉菜单效果基本上是一样的。不同的是在普通的下拉菜单的基础上封装了按钮(.btn)样式效果。简单点说就是点击一个按钮，会显示隐藏的下拉菜单。按钮下拉菜单其实就是普通的下拉菜单，只不过把“”标签元素换成了“”标签元素。唯一不同的是外部容器“div.dropdown”换成了“div.btn-group”。如下所示：按钮下拉菜单按钮下拉菜单项按钮下拉菜单项按钮下拉菜
  • vue项目下拉菜单点击选项弹出弹框的实现 奋斗者格洛古 vue.jsjavascript前端
    项目需求，点击下拉菜单的b选项，弹出编辑输入框：请选择选项A选项B弹窗内容这是一个弹窗。exportdefault{data(){return{selectedOption:"",showPopup:false};},methods:{handleOptionChange(){if(this.selectedOption==="B"){this.showPopup=true;}else{this.
  • SOLIDWORKS Visualize 界面介绍 solidworks_A 数码相机solidworks
    现在有越来越多的朋友在工作中选择使用SOLIDWORKSVisualize正版软件，这真是太棒了!这次的主题是小索带大家了解SOLIDWORKSVisualize界面，让更多的朋友快速的熟悉SOLIDWORKSVisualize界面。【菜单栏】位于界面的顶端，菜单栏包含多个下拉菜单。【3D视窗】位于界面的左侧，用于展示模型，3D视窗显示打开的项目与当前选定的相机，当进行移动相机、添加外观等操作时，
  • Shader Weaver使用教程9 - 使用模糊 OneMore2018
    我们将在本教程中做什么准备节点在项目视图中，打开“ShaderWeaver/Textures”文件夹并将“火焰”纹理设置为ROOT节点添加模糊节点连接blur1和ROOT节点将模糊1节点的“X”和“Y”的值更改为“1”按下“+”按钮在“[自定义参数]”栏中在输入栏中输入“blurX”，然后按下“新范围”按钮在输入栏中输入“blurY”并按下“新范围”按钮选择blur1节点下拉菜单并分别变为“blu
  • html表格标签(下)：lable标签，select标签和textara标签 fly in the sky ! 前端学习html程序人生
    html表格标签(下)：lable标签，select标签和textarea标签lable标签搭配input使用,点击label标签就能选中对应的单选/复选框,能够提升用户体验。for属性:指定当前label和哪个相同id的input标签对应(此时点击才是有用的)运行效果：select标签下拉菜单注：option中定义selected="selected"表示默认选中。示例代码：运行效果：默认选择年
  • uni-app引入Vant 下拉菜单dropdown选择过后边的之后再选择前边的选项出现点击无效 Florenza 问题解决uni-app
    解决办法：打开vant源码找到对应字段进行修改，这里以dropdown为例：找到wxcomponents/vant-weapp/dropdown-item/index.wxml打开后找到after-enter和after-leave这两个事件，并改为驼峰命名：afterEnter和afterLeave即可！有遇到问题的小伙伴可以去试一试，看下是否能够解决！
  • HTML和CSS 蘑菇plus
    表单标签男女篮球乒乓球足球游泳表单标签(下拉菜单和多行文本域)下拉菜单和多行文本域账号信息反馈信息成都重庆北京大连青岛上次没有发送信息空白标签认识cssdiv{background-color:deepskyblue;width:40%;}我是divcss选择器*{font-size:20px;}#a1{color:#00BFFF}div{color:yellow;}.c1{color:red;}
  • 二。CST 电路 微带低通滤波器设计练习 II 转换为3D模型 麦克斯韦信徒 CST电路仿真射频工程硬件工程
    上篇以电路的形式计算了微带低通滤波器的参数，那这一篇我们一起来看看怎么快速地转换并建立3D模型，然后计算参数，并和电路计算的参数进行比较。另外，本文中教会读者排除仿真中遇到的常见的一个错误问题，使仿真结果符合预期。1.各个微带模组组成的微带电路是什么样子？在CST电路中有一个功能是可以观察微带模组组合后的微带电路的，这个就是Assembly，装配功能。点击下图箭头指示的Edit下拉菜单，选择点击A
  • Enum用法 不懂事的小屁孩 enum
    以前的时候知道enum，但是真心不怎么用，在实际开发中，经常会用到以下代码: protected final static String XJ = "XJ"; protected final static String YHK = "YHK"; protected final static String PQ = "PQ";
  • 【Spark九十七】RDD API之aggregateByKey bit1129 spark
    1. aggregateByKey的运行机制   /** * Aggregate the values of each key, using given combine functions and a neutral "zero value". * This function can return a different result type
  • hive创建表是报错： Specified key was too long; max key length is 767 bytes daizj hive
    今天在hive客户端创建表时报错，具体操作如下   hive> create table test2(id string); FAILED: Execution Error, return code 1 from org.apache.hadoop.hive.ql.exec.DDLTask. MetaException(message:javax.jdo.JDODataSto
  • Map 与 JavaBean之间的转换 周凡杨 java自省转换反射
    最近项目里需要一个工具类，它的功能是传入一个Map后可以返回一个JavaBean对象。很喜欢写这样的Java服务，首先我想到的是要通过Java 的反射去实现匿名类的方法调用，这样才可以把Map里的值set 到JavaBean里。其实这里用Java的自省会更方便，下面两个方法就是一个通过反射，一个通过自省来实现本功能。 1：JavaBean类 1 &nb
  • java连接ftp下载 g21121 java
    有的时候需要用到java连接ftp服务器下载，上传一些操作，下面写了一个小例子。 /** ftp服务器地址 */ private String ftpHost; /** ftp服务器用户名 */ private String ftpName; /** ftp服务器密码 */ private String ftpPass; /** ftp根目录 */ private String f
  • web报表工具FineReport使用中遇到的常见报错及解决办法（二） 老A不折腾 finereportweb报表java报表总结
      抛砖引玉，希望大家能把自己整理的问题及解决方法晾出来，Mark一下，利人利己。   出现问题先搜一下文档上有没有，再看看度娘有没有，再看看论坛有没有。有报错要看日志。下面简单罗列下常见的问题，大多文档上都有提到的。   1、没有返回数据集： 在存储过程中的操作语句之前加上set nocount on 或者在数据集exec调用存储过程的前面加上这句。当S
  • linux 系统cpu 内存等信息查看 墙头上一根草 cpu内存liunx
    1 查看CPU 　　1.1 查看CPU个数 　　# cat /proc/cpuinfo | grep "physical id" | uniq | wc -l 　　2 　　**uniq命令：删除重复行;wc –l命令：统计行数** 　　1.2 查看CPU核数 　　# cat /proc/cpuinfo | grep "cpu cores" | u
  • Spring中的AOP aijuans springAOP
      Spring中的AOP Written by Tony Jiang @ 2012-1-18 （转）何为AOP AOP，面向切面编程。 在不改动代码的前提下，灵活的在现有代码的执行顺序前后，添加进新规机能。 来一个简单的Sample: 目标类： [java]  view plain copy print ? package&nb
  • placeholder(HTML 5) IE 兼容插件 alxw4616 JavaScriptjquery jQuery插件
    placeholder 这个属性被越来越频繁的使用. 但为做HTML 5 特性IE没能实现这东西. 以下的jQuery插件就是用来在IE上实现该属性的. /** * [placeholder(HTML 5) IE 实现.IE9以下通过测试.] * v 1.0 by oTwo 2014年7月31日 11:45:29 */ $.fn.placeholder = function
  • Object类,值域,泛型等总结(适合有基础的人看) 百合不是茶 泛型的继承和通配符变量的值域Object类转换
    java的作用域在编程的时候经常会遇到,而我经常会搞不清楚这个 问题,所以在家的这几天回忆一下过去不知道的每个小知识点   变量的值域;   package 基础; /** * 作用域的范围 * * @author Administrator * */ public class zuoyongyu { public static vo
  • JDK1.5 Condition接口 bijian1013 javathreadConditionjava多线程
    Condition 将 Object 监视器方法（wait、notify和 notifyAll）分解成截然不同的对象，以便通过将这些对象与任意 Lock 实现组合使用，为每个对象提供多个等待 set （wait-set）。其中，Lock 替代了 synchronized 方法和语句的使用，Condition 替代了 Object 监视器方法的使用。 条件（也称为条件队列或条件变量）为线程提供了一
  • 开源中国OSC源创会记录 bijian1013 hadoopsparkMemSQL
    一.Strata+Hadoop World（SHW）大会         是全世界最大的大数据大会之一。SHW大会为各种技术提供了深度交流的机会，还会看到最领先的大数据技术、最广泛的应用场景、最有趣的用例教学以及最全面的大数据行业和趋势探讨。          二.Hadoop   &nbs
  • 【Java范型七】范型消除 bit1129 java
    范型是Java1.5引入的语言特性，它是编译时的一个语法现象，也就是说，对于一个类，不管是范型类还是非范型类，编译得到的字节码是一样的，差别仅在于通过范型这种语法来进行编译时的类型检查，在运行时是没有范型或者类型参数这个说法的。 范型跟反射刚好相反，反射是一种运行时行为，所以编译时不能访问的变量或者方法(比如private)，在运行时通过反射是可以访问的，也就是说，可见性也是一种编译时的行为，在
  • 【Spark九十四】spark-sql工具的使用 bit1129 spark
    spark-sql是Spark bin目录下的一个可执行脚本，它的目的是通过这个脚本执行Hive的命令，即原来通过 hive>输入的指令可以通过spark-sql>输入的指令来完成。 spark-sql可以使用内置的Hive metadata-store，也可以使用已经独立安装的Hive的metadata store   关于Hive build into Spark
  • js做的各种倒计时 ronin47 js 倒计时
    第一种：精确到秒的javascript倒计时代码      HTML代码:   <form name="form1">   <div align="center" align="middle"
  • java-37.有n 个长为m+1 的字符串，如果某个字符串的最后m 个字符与某个字符串的前m 个字符匹配，则两个字符串可以联接 bylijinnan java
    public class MaxCatenate { /* * Q.37 有n 个长为m+1 的字符串，如果某个字符串的最后m 个字符与某个字符串的前m 个字符匹配，则两个字符串可以联接， * 问这n 个字符串最多可以连成一个多长的字符串，如果出现循环，则返回错误。 */ public static void main(String[] args){
  • mongoDB安装 开窍的石头 mongodb安装 基本操作
    mongoDB的安装          1:mongoDB下载   https://www.mongodb.org/downloads         2:下载mongoDB下载后解压     
  • [开源项目]引擎的关键意义 comsci 开源项目
         一个系统，最核心的东西就是引擎。。。。。       而要设计和制造出引擎，最关键的是要坚持。。。。。。       现在最先进的引擎技术，也是从莱特兄弟那里出现的，但是中间一直没有断过研发的    
  • 软件度量的一些方法 cuiyadll 方法
    软件度量的一些方法http://cuiyingfeng.blog.51cto.com/43841/6775/在前面我们已介绍了组成软件度量的几个方面。在这里我们将先给出关于这几个方面的一个纲要介绍。在后面我们还会作进一步具体的阐述。当我们不从高层次的概念级来看软件度量及其目标的时候，我们很容易把这些活动看成是不同而且毫不相干的。我们现在希望表明他们是怎样恰如其分地嵌入我们的框架的。也就是我们度量的
  • XSD中的targetNameSpace解释 darrenzhu xmlnamespacexsdtargetnamespace
    参考链接: http://blog.csdn.net/colin1014/article/details/357694 xsd文件中定义了一个targetNameSpace后，其内部定义的元素，属性，类型等都属于该targetNameSpace,其自身或外部xsd文件使用这些元素，属性等都必须从定义的targetNameSpace中找： 例如：以下xsd文件，就出现了该错误，即便是在一
  • 什么是RAID0、RAID1、RAID0+1、RAID5，等磁盘阵列模式? dcj3sjt126com raid
    RAID 1又称为Mirror或Mirroring，它的宗旨是最大限度的保证用户数据的可用性和可修复性。 RAID 1的操作方式是把用户写入硬盘的数据百分之百地自动复制到另外一个硬盘上。由于对存储的数据进行百分之百的备份，在所有RAID级别中，RAID 1提供最高的数据安全保障。同样，由于数据的百分之百备份，备份数据占了总存储空间的一半，因而，Mirror的磁盘空间利用率低，存储成本高。 Mir
  • yii2 restful web服务快速入门 dcj3sjt126com PHPyii2
    快速入门 Yii 提供了一整套用来简化实现 RESTful 风格的 Web Service 服务的 API。 特别是，Yii 支持以下关于 RESTful 风格的 API： 支持 Active Record 类的通用API的快速原型 涉及的响应格式（在默认情况下支持 JSON 和 XML) 支持可选输出字段的定制对象序列化 适当的格式的数据采集和验证错误
  • MongoDB查询(3)——内嵌文档查询（七） eksliang MongoDB查询内嵌文档MongoDB查询内嵌数组
    MongoDB查询内嵌文档 转载请出自出处：http://eksliang.iteye.com/blog/2177301 一、概述        有两种方法可以查询内嵌文档：查询整个文档；针对键值对进行查询。这两种方式是不同的，下面我通过例子进行分别说明。   二、查询整个文档 例如:有如下文档 db.emp.insert({ &qu
  • android4.4从系统图库无法加载图片的问题 gundumw100 android
    典型的使用场景就是要设置一个头像，头像需要从系统图库或者拍照获得，在android4.4之前，我用的代码没问题，但是今天使用android4.4的时候突然发现不灵了。baidu了一圈，终于解决了。 下面是解决方案： private String[] items = new String[] { "图库","拍照" }; /* 头像名称 */
  • 网页特效大全 jQuery等 ini JavaScriptjquerycsshtml5ini
    HTML5和CSS3知识和特效 asp.net ajax jquery实例 分享一个下雪的特效 jQuery倾斜的动画导航菜单 选美大赛示例 你会选谁 jQuery实现HTML5时钟 功能强大的滚动播放插件JQ-Slide 万圣节快乐！！！ 向上弹出菜单jQuery插件 htm5视差动画 jquery将列表倒转顺序 推荐一个jQuery分页插件 jquery animate
  • swift objc_setAssociatedObject block(version1.2 xcode6.4) 啸笑天 version
      import UIKit class LSObjectWrapper: NSObject { let value: ((barButton: UIButton?) -> Void)? init(value: (barButton: UIButton?) -> Void) { self.value = value
  • Aegis 默认的 Xfire 绑定方式，将 XML 映射为 POJO MagicMa_007 javaPOJOxmlAegisxfire
          Aegis 是一个默认的 Xfire 绑定方式，它将 XML 映射为 POJO, 支持代码先行的开发.你开发服 务类与 POJO,它为你生成 XML schema/wsdl XML 和 注解映射概览       默认情况下，你的 POJO 类被是基于他们的名字与命名空间被序列化。如果
  • js get max value in (json) Array qiaolevip 每天进步一点点学习永无止境max纵观千象
    // Max value in Array var arr = [1,2,3,5,3,2];Math.max.apply(null, arr); // 5 // Max value in Jaon Array var arr = [{"x":"8/11/2009","y":0.026572007},{"x"
  • XMLhttpRequest 请求 XML,JSON ,POJO 数据 Luob. POJOjsonAjaxxmlXMLhttpREquest
    在使用XMlhttpRequest对象发送请求和响应之前，必须首先使用javaScript对象创建一个XMLHttpRquest对象。 var xmlhttp； function getXMLHttpRequest(){ if(window.ActiveXObject){ xmlhttp:new ActiveXObject("Microsoft.XMLHTTP
  • jquery wuai jquery
    以下防止文档在完全加载之前运行Jquery代码，否则会出现试图隐藏一个不存在的元素、获得未完全加载的图像的大小 等等 $(document).ready(function(){ jquery代码; }); <script type="text/javascript" src="c:/scripts/jquery-1.4.2.min.js&quo
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他