当前位置: 首页 > news >正文

基于jQuery的下拉菜单插件,诸位上眼!!!

前言

很久没有写博客了,话说真的工作后才发现很多需要学的,有很多不足。

加之最近工作没有什么沉淀,现在团队又面临解散,反正闲着也是闲着,就自己写了个插件,反正水平就这样,当时自我总结吧!

应用背景

在我们工作中,经常会遇到这种需求:





① 鼠标点击某个文本框时出现下拉菜单

② 常用的操作鼠标划上出现下拉菜单

③ 按钮类应用

我们会用到这种功能往往原因是因为地方小了,按钮多了,这往往说明产品设计一般出问题了。。。 但是,我辈屁民豪不关注产品(没资格插手),所以需要完成以上功能;

其实总的来说,这些功能还是非常实用的。

于是,为了应对以上场景,我工作中先是做了一个,然后又遇到了,然后又遇到了,所以最后就写了这么一个东西。

集中展示



几个功能放到一起了,前端代码如下:

View Code
 

js代码:

View Code
 

难点&后续

做的过程中还是遇到了几个问题的,比如:

① 菜单展开后如何关闭

② 多级菜单如何处理

不完善的级联效果

③ 事件如何回调

最后做出了这个比较简陋的东东。。。。

但是做完后也发现了一些问题:



① 像这种菜单在最左最下出现时没有解决;

② 然后菜单项过多时候也没有出现像select的滚动条;

③ 由于个人水平,整个代码的质量亦有问题;

④ 开始也考虑了异步数据加载的问题,但是着实有点难便放弃了,功能代码有一点,有兴趣的同学可以看看:

View Code
 

 

所以先贴出来和各位看看,后续小生再行优化,希望能把这个功能做好!



本文转自叶小钗博客园博客,原文链接:http://www.cnblogs.com/yexiaochai/archive/2013/03/29/2988939.html,如需转载请自行联系原作者

相关文章:

  • 【转】整理了一些常用的面试题,掌握了这些基本上就没什么问题了
  • linux 内核库函数 【转】
  • java 切割日期时间段,分割时间段
  • shell、python脚本终端颜色输出
  • 转换图片大小
  • Node.js 新计划:使用 V8 snapshot 将启动速度提升 8 倍
  • Linux系统查看系统是32位还是64位方法总结【转】
  • 扩展Label控件(1) - 实现回发(Postback)功能
  • 使用 Github Pages 发布你的项目文档
  • 解决客户一例:使用域超级管理员打开Exchange 2010发现没有权限
  • AngualrJs 微信支付url未注册大坑解决方法
  • mac终端下svn常用命令
  • http协议进阶(四)报文首部
  • QName
  • 浅议tomcat与classloader
  • [deviceone开发]-do_Webview的基本示例
  • 「前端早读君006」移动开发必备:那些玩转H5的小技巧
  • C++类的相互关联
  • Service Worker
  • ubuntu 下nginx安装 并支持https协议
  • Work@Alibaba 阿里巴巴的企业应用构建之路
  • 老板让我十分钟上手nx-admin
  • 前端自动化解决方案
  • 如何实现 font-size 的响应式
  • 实习面试笔记
  • 实战|智能家居行业移动应用性能分析
  • 我与Jetbrains的这些年
  • 一个普通的 5 年iOS开发者的自我总结,以及5年开发经历和感想!
  • 怎样选择前端框架
  • 1.Ext JS 建立web开发工程
  • PostgreSQL之连接数修改
  • 新海诚画集[秒速5センチメートル:樱花抄·春]
  • ​学习一下,什么是预包装食品?​
  • # Python csv、xlsx、json、二进制(MP3) 文件读写基本使用
  • # 达梦数据库知识点
  • #、%和$符号在OGNL表达式中经常出现
  • #100天计划# 2013年9月29日
  • #if #elif #endif
  • #控制台大学课堂点名问题_课堂随机点名
  • (16)UiBot:智能化软件机器人(以头歌抓取课程数据为例)
  • (二)WCF的Binding模型
  • (附源码)node.js知识分享网站 毕业设计 202038
  • (附源码)springboot“微印象”在线打印预约系统 毕业设计 061642
  • *(长期更新)软考网络工程师学习笔记——Section 22 无线局域网
  • .mysql secret在哪_MySQL如何使用索引
  • .NET 中使用 Mutex 进行跨越进程边界的同步
  • .NET/C# 使窗口永不激活(No Activate 永不获得焦点)
  • .Net下C#针对Excel开发控件汇总(ClosedXML,EPPlus,NPOI)
  • [ 英语 ] 马斯克抱水槽“入主”推特总部中那句 Let that sink in 到底是什么梗?
  • [.NET]桃源网络硬盘 v7.4
  • []error LNK2001: unresolved external symbol _m
  • [2024最新教程]地表最强AGI:Claude 3注册账号/登录账号/访问方法,小白教程包教包会
  • [Android] Implementation vs API dependency
  • [Android]Android P(9) WIFI学习笔记 - 扫描 (1)
  • [C/C++]数据结构 深入挖掘环形链表问题