有关suggest快速删除后仍然出现下拉列表的bug问题_javascript技巧

 写suggest的时候,有时我们快速删除输入框的文字后,但是suggest下拉列表还有出现,导致的原因是因为ajax异步请求造成的。

虽然我们把输入框的内容都删除了,甚至做了停止后续请求的相关操作,但是由于ajax是异步的,即使你停止了后续的操作,但是最后一次请求的数据还在回来的路上。

解决办法看代码:

var inp = document.getElementById('inp'),
timer = 0;
inp.oninput = function (e) {
var val = e.target.value;
var f = function () {
alert(val)
}
if (val === '') {
f = function () {
console.log('setState = []');
}
}
clearTimeout(timer);
timer = setTimeout(function () {
f();
}, 400);
}

我这里贴的代码只是解决思路,把获取到请求回来的数据后续的相关操作先封装到函数里,当检测到value为空的时候,把函数的操作变化一下,就不会出现suggest数据框了。

以上所述是小编给大家介绍的有关suggest快速删除后仍然出现下拉列表的bug问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索下拉列表
Suggest
javascript下拉菜单、javascript下拉列表、javascript 下拉框、javascript 下拉刷新、javascript多选下拉框,以便于您获取更多的相关知识。

时间: 2024-09-29 02:21:13

有关suggest快速删除后仍然出现下拉列表的bug问题_javascript技巧的相关文章

js动态删除div元素基本思路及实现代码_javascript技巧

在做用户查找时 因为要把查找的结果动态加载和显示,所以,那些html元素要由Ajax动态生成.用户打开查找界面时,有系统推荐的用户,而当用户按条件查找后,查找的结果动态加载和显示.所以考虑到用js来搞. 这个for循环就是移除已有的表单.然后根据Ajax请求过来的数据,动态生成新的表单对象.一定要注意j变量从大往小循环,否则,删除div元素后会引起serchResultLenth=serchResult.children.length;长度的变化(这个问题摸索了好久,才搞定,切记) 复制代码 代

javascript 删除数组中重复项(uniq)_javascript技巧

可以直接使用的代码:修正版 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 下面是进阶教程与说明,喜欢跟深入的朋友可以参考下.首先让我们看下 YUI 是如何处理的: 复制代码 代码如下: var toObject = function(a) { var o = {}; for (var i = 0; i < a.length; i = i+1) { o[a[i]] = true; } return o; }; var keys = function(o) { var a=[], i;

JavaScript中关于for循环删除数组元素内容时出现的问题_javascript技巧

昨天用for循环进行数组去重的时候出现的问题, 首先,用双重for循环把前一个和所有后面的元素进行比较,如果相等则删除. 但是,如果数组里面有三个以上连续相等的元素的时候,就会出现问题. var arr = [1,1,1,2,2]; for(var i=0; i<arr.length-1; i++){ for(var j=i+1; j<arr.length; j++){ if(arr[i] === arr[j]){ arr.splice(j,1); } } } document.write(&

关于innerHTML后丢失动态绑定的EVENT问题解决方法_javascript技巧

用innerHTML取出一段内容后再innerHTML回去,那么原来动态绑定的事件就会丢失,如: html: 复制代码 代码如下: <body><div id='d1'>点击</div></body> script: 复制代码 代码如下: document.getElementById('d1').onclick=function(){alert(1)}; var html=document.body.innerHTML; document.body.inn

javascript删除Table中的一行的脚本代码_javascript技巧

流程名称 表单名称 上传附件 操作 请假单1 请假单 不允许 删除 请假单2 请假单 不允许 删除 请假单3 请假单 不允许 删除 请假单4 请假单 不允许 删除

二叉树的非递归后序遍历算法实例详解_javascript技巧

前序.中序.后序的非递归遍历中,要数后序最为麻烦,如果只在栈中保留指向结点的指针,那是不够的,必须有一些额外的信息存放在栈中.方法有很多,这里只举一种,先定义栈结点的数据结构 复制代码 代码如下: typedef struct{Node * p; int rvisited;}SNode //Node 是二叉树的结点结构,rvisited==1代表p所指向的结点的右结点已被访问过. lastOrderTraverse(BiTree bt){ //首先,从根节点开始,往左下方走,一直走到头,将路径上

JavaScript快速检测浏览器对CSS3特性的支持情况_javascript技巧

在项目中需要快速检测浏览器是否支持某CSS3特性,比如检测是否支持"transform",然后我的布局会有两种完全不同的版式. 当然除开本文介绍的这种快速方法,还有一种更有名和更通用的方法,那就是modernizr,运行脚本之后它会在html的class上加上浏览器支持的所有特性的列表. 优点: js是可配置的,不需要的特性检测可以在配置脚本中去掉基于特性检测js库简单好用 除此之外还有一种不太好的方法,那就是判断浏览器的UA,不好的原因是UA可能会伪造,而且版本判断繁琐,还有不稳定.

js点击文本框后才加载验证码实例代码_javascript技巧

经常到各大网站去留言或者发帖的朋友应该知道现在很多网站的留言地方的验证码不是直接显示的.而是在点击验证码输入框之后才会显示出来验证码的.下面作者也总结了一篇关于如何利用js实现点击文本框然后再加载验证码的效果的. 废话不多说了,下面是具体的实现代码. <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title

删除数组条目中重复的条目(可能有多个),返回值是一个仅包含被删除的重复条目的新数组。_javascript技巧

今日在bluediea看到淘宝在线招聘,相信淘宝的技术还是很牛的,于是赶紧打开看看题目并试着做做. 到了第三题时卡了偶老半天,并不是做不出来,感觉有很简便的方法但自己就是一时想不出来,不过费了九牛二虎之力终于完成本题,给出了一个另自己还比较满意的答案,欢迎各位朋友指点! 题目如下: 请给Array本地对象增加一个原型方法,它的用途是删除数组条目中重复的条目(可能有多个),返回值是一个仅包含被删除的重复条目的新数组. [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 复制代码 代码如下: