支持模糊查询的替代html中select的jquery插件
2023-09-14 09:02:07 时间
原创文章,转载请注明出处:http://blog.csdn.net/sannychan/article/details/24271351
我们在页面上经常会用到select,里面的内容长度不定,有时候为了界面美观,select的长度比实际可选内容要短。
这个时候就可以发现IE8及以下IE的显示效果,与FireFox、chrome等是不一样的。
IE8及以下版本显示为:select的宽度决定了下拉选项的可视宽度,比如:
但在FireFox和chrome中,下拉选项的可视宽度自适应选项的宽度,据说IE9及以上版本也实现了该效果:
因项目中用到了select,部分内容超出select宽度,导致部分选项不可视。但目前使用的人员大多使用IE8浏览器,因此用了工作之余写了一个jquery插件,用于替换select,不废话,直接上图:
使用方式:
//输入参数,为id、text键值对。 var datas =[{"id":"2","text":"中国石油天然气股份有限公司"}, {"id":"4","text":"中国建筑股份有限公司"}] //文本点击触发的事件,自行编码,通过this.id和this.innerHTML获取相应的值 var itemSelectFuntion = function(){ alert(this.id + "," + this.innerHTML); //调用方式(第一个参数为input的id,第二个参数为输入参数,第三个为点击事件) $.selectSuggest(testInput,datas,itemSelectFuntion);
关于VSCode中下载插件后还不能运行html文件到浏览器的问题 这段时间在学习html的过程中,想用VSCode运行html代码到浏览器,查阅资料后发现需要下载open in browser插件,但下载后右键点击仍然没有open in Default Browser的选项。经过反复的比对后,发现是下载的插件错误。
相关文章
- jquery 提示弹窗
- JQuery实现对html结点的操作(创建,添加,删除)
- 第一百九十七节,jQuery EasyUI,LinkButton(按钮)组件
- jquery中美元符号($)命名冲突
- [CoffeeScript] Level 2: jQuery to CoffeeScript -- Ex
- jQuery跨域请求,跨域Post提交数据的方法(.net/SQL技术交流群206656202 入群需注明博客园) - 思...
- jquery 添加html元素后 html中click失效问题
- Jquery Ajax调用aspx页面方法
- 用原生JS模仿jquery,需要HTML5的支持
- electron 关于jquery不可以用
- [FAQ] jQuery prop 与 attr 的区别
- jQuery.sap.newObject
- js div禁止点击,恢复点击(jquery)
- div点击父元素后只要特定的子元素响应(jquery举例)
- jquery源码系列:append方法实现过程
- 生日祝福(HTML+CSS+JavaScript+jQuery)
- jQuery 实现添加表格行,删除行,调用日期控件
- input checkbox复选框点击获取当前选中状态jquery
- Jquery操作属性选择器
- jQuery回到顶部插件jQuery GoUp
- jquery入门 改动网页背景颜色
- 跟随屏幕滚动层、遮罩层、获取Div相对定位、整个屏幕、html文档的jquery基本操作
- Jquery 操作Html 控件 CheckBox、Radio、Select 控件
- jquery案例7——王者显示与隐藏、淡入、淡出、遮罩层、fadeIn、fadeOut
- 通过jquery库扩展移动端‘长按触发’事件(模拟浏览器‘长按识别二维码’功能)