combobox自己主动提示组件加入无选中项清空功能
这个标题非常绕口,只是这也是想了半天的成果,对不起体育老师了。
标题想表达的是:之前讲过的用combobox实现自己主动提示组件。只是如今规定该组件不能够保存data中不存在的数据。
最初的想法是通过onChange事件来作推断。可是无奈该函数在自己主动提示的模式下,每change一次会触发2次onChange事件,太诡异了遂放弃之。
并且onChange事件是在每次combobox中的内容改变时触发,若是keyword输入过程中,该事件一直触发。
而我们所要的效果是等用户输入结果再作校验,所以不符合要求。
查找API发现combo提供了一个onHidePanel事件的扩展点,当自己主动提示框隐藏时触发。
当时的想法是:输入完之后当然会隐藏输入框啦,感觉能够当成是完毕输入的标识。
试了试,基本能够满足要求。有点小问题。就是用户高速输入之后点击其它地方。combobox失去焦点之后,有可能连输入框都不显示,何谈隐藏?
哎~通过现有API好像都无法完美地解决这个问题,那么就仅仅有自己写了。。but 我的前端水平真是不怎么样,瞎j8鼓捣了一个版本号,大家凑合看看~
$.extend($.fn.combobox.methods, {
completeCheck:function(jq){
var textbox = jq.combobox('textbox');
console.log(jq)
textbox.on('blur', function(){
setTimeout('doCompleteCheck("' + jq.selector + '")', 200); // 这里先让combobox的一些操作走
})
}
});
function doCompleteCheck(selector){
var jq = $(selector);
var value = jq.combobox('getValue');
var json = jq.combobox('getData');
if(!findInJson(json, value)){
jq.combobox('clear');
jq.combobox('hidePanel');
}
}
我为combobox加入了一个新的方法:completeCheck
主要是为combobox中的textbox加入一个onBlur事件,这个textbox也就是我们在输入时的那个input组件。
那么当textbox失去焦点时则会触发doCompleteCheck函数。可是这里先要让combobox的一些操作先运行
所以我们给了200ms的延迟,之后通过比較是否存在在data中来决定是否须要清空combobox中的输入值
这里补充一点,事实上若是输入的内容不在data中。combobox('getValue')的值都会是undefined,所以这样也能够来推断。
使用的时候就像调用combobox的其它方法一样就能够了。$('#cc').combobox('completeCheck');
combobox自己主动提示组件加入无选中项清空功能的更多相关文章
- 利用easyUI的combobox打造自己主动提示组件
自己主动提示是时下一个非常流行的功能,比方说百度.谷歌的搜索输入框都使用到了这么一个功能. 因为easyUI的combobox设计师已经考虑到了这个功能.所以仅仅需简单几步我们能够轻松打造自己的自己主 ...
- 【技巧】为ComboBox添加自动提示
一.需求来源 最近有个项目用到了ComboBox控件,在演示的时候,要对Word文档中选中部分添加符合DocBook标准的标签,这些标签是DocBook中元素的集合,数据量不多,大概170多个吧,但是 ...
- 自绘制HT For Web ComboBox下拉框组件
传统的HTML5的下拉框select只能实现简单的文字下拉列表,而HTforWeb通用组件中ComboBox不仅能够实现传统HTML5下拉框效果,而且可以在文本框和下拉列表中添加自定义的小图标,让整个 ...
- 由于抽签HT For Web ComboBox下拉框组件
传统HTML5的下拉框select仅仅能实现简单的文字下拉列表,而HT for Web通用组件中ComboBox不仅可以实现传统HTML5下拉框效果,并且可以在文本框和下拉列表中加入自己定义的小图标, ...
- Android Studio如何设置自己主动提示代码
同Eclipse时间,您可以设置,无论你是设置输入不管什么信,可以提示码,在Android Studio也可以 设置.并且比Eclipse设置来的简单. 当然假设你认为代码自己主动提示会减少你的代码水 ...
- [js开源组件开发]tip提示组件
tip提示组件 常见的应用场景中,总是难免会遇到提示信息,比如显示不完全时需要鼠标移上去显示title,比如验证时的错误提示,比如操作按钮的辅助说明等,所以我独立出来了一个小的js组件,tip提示组件 ...
- Android Studio代码自己主动提示无效(not available in Power Save mode)
针对一位博友提的问题,我这边写出来,预计还是非常多人会碰到这个问题,可是不知道怎样解决的. 就是在设置了代码自己主动提示功能后,发现不生效的,怎样设置代码自己主动提示请戳这:Android Studi ...
- 从后台绑定数据到ligerui 的comboBox下拉框组件
这次来记录一下ligerUI的comboBox下拉框组件,ligerUI的API里也有相关描写叙述,上面都是前台写死数据,然后显示在组件中,我这次要说的是将后台的数据绑定到下拉框组件中,废话不多说. ...
- myeclipse中配置spring xml自己主动提示
版权声明: https://blog.csdn.net/zdp072/article/details/24582173 这是一篇分享技巧的文章:myeclipse中配置spring xml自己主动提示 ...
随机推荐
- Java中的statickeyword具体解释
1.statickeyword主要有2个作用: ①为某特定的数据类型或者对象分配单一的存储空间.而与创建对象的个数无关. ②在不创建对象的情况下能够直接通过类名来直接调用方法或者使用类的属性. 2.s ...
- 【LaTeX排版】LaTeX论文排版<三>
A picture is worth a thousand words(一图胜千言).图在论文中的重要性不言而喻,本文主要解说图的制作与插入. 1.图像的插入 图像能够分为两大类:位图和向量图 ...
- Python3.2官方文档-日志和弱引用
8.5 日志 Logging模块提供了一些功能全面和灵活的日志系统.最简单的形式就是把日志信息发送到一个文件或sys.stderr; import logging logging.debug('Deb ...
- 树上第k小,可持久化线段树+倍增lca
给定一颗树,树的每个结点都有权值, 有q个询问,每个询问是 u v k ,表示u到v路径上第k小的权值是多少. 每个结点所表示的线段树,是父亲结点的线段树添加该结点的权值之后形成的新的线段树 c[ro ...
- 让浏览器支持 jquery ajax load 前进、后退 功能
BEGIN; 一般在做 ajax load 的时候,非常多人都不会考虑到须要浏览器支持前进后退功能,由于大部分人都不知道能够实现. 近期遇到这个问题,经过一小段研究,发现github已经有现成的开源工 ...
- hdu2089不要62(数位dp)
#include <stdio.h> #include <string.h> ][]; ]; /* dp[i][0] 不含62,4 dp[i][1] 2开头 dp[i][2] ...
- jdk并发包 CopyOnWriteArrayList源代码分析
CopyOnWriteArrayList是jdk1.5并法包里面用于处理高并发下.读多写少的情况下.减少锁等待的集合类.以下对该类实现做一个简要的分析 1,首先CopyOnWriteArrayList ...
- swift笔记 (三) —— 字符和字符串
字符串和字符 苹果要是不提供了unicode的字符串和字符,那就是他们公司全部人的脑袋都被门夹过 他自己家都要发非常多国家的版本号的软件,怎么可能不用unicode呢 此处略去30字... 这里能够拿 ...
- android应用开发--------------看RadioGroup源代码,写相似单选选项卡的集成控件(如底部导航,tab等等)
博客为 有时个哥 原创.如需转载请标明出处:http://blog.csdn.net/ls703/article/details/46694967 watermark/2/text/aHR0cDovL ...
- hdu1372 dfs搜索之国际象棋的马
原题地址 题意 一个8x8的国际象棋棋盘,你有一个棋子"马".算出棋子"马"从某一格到还有一格子的最少步数. 与普通dfs不同的是,你能走的路线不是上下左右,四 ...