Jquery autocomplete 下拉项显示图片
来源:互联网 发布:ibm医疗大数据 编辑:程序博客网 时间:2024/06/05 12:08
使用Jquery 的 autocomplete 插件时, 默认下拉项中只能展示文本,不能 能添加HTML代码。
解决方案:
第一步:修改源代码打开jquery.ui.autocomplete.js 在第407行左右
.append( $( "<a></a>" ).text( item.label ) )
=====改为=====
.append( $( "<a></a>" ).html( item.label ) )
第二步:在你返回的数据里添加入图片的html如:
["<img src='http://www.localhost:8080/text/png/userinfo/edit.png'>"]
不过需要注意的是当你选中值时是直接得到"<img src='http://www.localhost:8080/text/png/userinfo/edit.png'>"美国”所以你得过滤一下html。
修改方法:
jquery.ui.autocomplete.js 在第205行左右
if ( false !== self._trigger( "select", event, { item: item } ) ) {
//self.element.val( item.value );
self.element.val( item.value.replace(/<\/?[^>]*>/g,'') );//过滤html
}
最终效果 :
0 0
- Jquery autocomplete 下拉项显示图片
- Autocomplete extender显示图片
- Jquery autocomplete 异步加载下拉数据
- jquery.autocomplete IE6 下拉框遮住
- jquery省市区下拉显示
- 修复jQuery Autocomplete下拉菜单不能左对齐的情况
- jQuery 插件autocomplete 应用(模拟的下拉菜单)
- jQuery ui autocomplete实现联想输入下拉菜单
- jquery UI autocomplete获得焦点自动弹出跟随下拉框
- jQuery UI Autocomplete控件下拉列表固定高度
- jQuery.autocomplete 可输入的下拉选择框
- Jquery autocomplete
- Jquery autocomplete
- jQuery Autocomplete
- jquery.autocomplete
- jquery.autocomplete
- Jquery autocomplete
- Jquery autocomplete
- Java(Android) Excpetion
- hdu 1160 FatMouse's Speed(最大上升子序列dp)
- OpenGL基础
- Android的事件分发(二)
- CUDA从入门到精通
- Jquery autocomplete 下拉项显示图片
- 基于IBM Bluemix开发微信公共账号应用
- #Chapter 5 -- Operating System
- C++算法之——常用算法总结
- 发外链难还是建站难www.lanilani.cn
- 58 css 改变input type=file样式 placeholder属性
- 6.23 Block封装post异步网路请求& AFNetworking第三方封装
- nginx tomcat集群配置实现无痛重启服务教程python语言版本
- ZOJ_3795 Grouping(强连通分量 拓扑)