js实时查询，为空提示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=width-width, initial-scale=1, minimum-scale=1, maximum-scale=1"/>
<title>实时查询</title>
<script src="../commonJs/jquery-3.1.0.min.js"></script>
<style>
* {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
} body {
padding-top: 30px;
margin: 0 auto;
} ul {
width: 80%;
margin: 10px auto 0;
list-style: none;
} input {
display: block;
width: 80%;
padding: 5px;
margin: 0 auto;
outline: none;
}
p {
display: none;
text-align: center;
}
</style>
</head>
<body>
<input type="text" id="searchInput" placeholder="请输入查询信息"/>
<ul>
<li>A. you can <small>2020-09-10</small></li>
<li>B. you must can <small>星期四</small></li>
<li>C. try your best <small>下午，雨天</small></li>
<li>D. live your life without regret <small>工作记录</small></li>
</ul>
<p>没有查询结果</p>
<script>
$(function() {
$("#searchInput").keyup(function() {
var value = $(this).val(); // 获取搜索框的内容
var flag = true; // 控制为空提示
$("ul li").each(function() { // 对查询各个选项进行遍历
$(this).hide(); // 将各个选项设置隐藏
// $(this).text()获取项目<li>的文本，调用indexOf()，$.trim(value)去掉输入内容的左右空格，如何匹配，则显示相应选项，匹配不到结果为-1,条件等于0也成立是因为内容框没有结果时把选项都显示。
if ($(this).text().indexOf($.trim(value)) >= 0) {
$("p").hide(); // 若出现查询结果为空时，为空提示会显示，再次搜索到相应选项时，为空提示应该隐藏。
$(this).show(); // 根据搜索内容匹配选项，将选项显示
flag = false; // 改变为空控制条件，使得有选项符合查询条件不显示为空提示。
}
});
if(flag) {
$("p").show();
}
});
})
</script>
</body>
</html>
———— 就多尝试吧~求知精神会丰富你暂时空白的脑壳子的————
js实时查询，为空提示的更多相关文章
- java+数据库+D3.js 实时查询人物关系图
先看下 效果 某个用户,邀请了自己的朋友 ,自己的朋友邀请了其他朋友,1 展示邀请关系,2 点击头像显示邀请人和被邀请人的关系.(网上这种资料很少, 另外很多都是从JSON文件取 数据, 这里是从数据 ...
- js 实时监听input中值变化
注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...
- SQL Server2016 新功能实时查询统计信息
SQL Server2016 新功能实时查询统计信息 很多时候有这样的场景,开发抱怨DBA没有调优好数据库,DBA抱怨开发写的程序代码差,因此,DBA和开发都成为了死对头,无法真正排查问题. DBA只 ...
- 一步一步跟我学习lucene（19）---lucene增量更新和NRT(near-real-time)Query近实时查询
这两天加班,不能兼顾博客的更新.请大家见谅. 有时候我们创建完索引之后,数据源可能有更新的内容.而我们又想像数据库那样能直接体如今查询中.这里就是我们所说的增量索引.对于这种需求我们怎么来实现呢?lu ...
- c#程序中使用"like“查询access数据库查询为空的问题
今天,在开发的过程中发现了一个特别奇怪的问题:access中like查询时候,在Access数据库中执行,发现可以查询出结果,这是在数据库上执行,select * from KPProj where ...
- 使用 iosOverlay.js 创建 iOS 风格的提示和通知
iosOverlay.js 用于在 Web 项目中实现 iOS 风格的通知和提示效果.为了防止图标加载的时候闪烁,你需要预加载的图像资源.不兼容 CSS 动画的浏览器需要 jQuery 支持.浏览器兼 ...
- js判断是否为空火undefined是否给undefined加引号
js判断是否为空为undefined如果判断的是类型则用typeof(),如果其本身就是“undefind”字符窜,则不能这样判断, 这样typeof之后是字符串类型就判断不出来了,这是需要去掉typ ...
- 在MyEclipse中如何去掉JS或jsp语法错误提示!
在MyEclipse中如何去掉JS或jsp语法错误提示! 关于在 MyEclipse 上 WEB 工程里面的 JS/JSP 经常会有语法错误提示,这是由于 MyEclipse 对其语法要求相当严格所造 ...
- memcache锁,解决查询过多email查询为空的问题
/* 设置memcache锁,解决查询过多email查询为空的问题 Begin */ $mmc = new Memcache; $mmc->connect('127.0.0.1', 11211) ...
随机推荐
- JVM-learning
JVM是什么?? Java Virtual Mechine JRE(JavaRuntimeEnvironment,Java运行环境),也就是Java平台.所有的Java 程序都要在JRE下才能运行. ...
- 描述 Java 中的重载和重写？
重载和重写都允许你用相同的名称来实现不同的功能,但是重载是编译时活动, 而重写是运行时活动.你可以在同一个类中重载方法,但是只能在子类中重写方 法.重写必须要有继承.
- 介绍一下 WebApplicationContext？
WebApplicationContext 是 ApplicationContext 的扩展.它具有 Web 应用 程序所需的一些额外功能.它与普通的 ApplicationContext 在解析主题 ...
- HMS Core定位服务在生活服务类App中可以自动填写收货地址啦
在涉及团购.外卖.快递.家政.物流.搬家等生活服务类的App.小程序中,填写收货地址是用户高频使用的功能.这一功能通常采取让用户手动填写的解决方案,例如上下拉动选择浙江省-->杭州市--> ...
- 数据结构：DHUOJ 删除链表的顺数及倒数第N个节点
删除链表的顺数及倒数第N个节点 作者: turbo时间限制: 1S章节: DS:数组和链表 题目描述: 可使用以下代码,完成其中的removeNth函数,其中形参head指向无头结点单链表,n为要删除 ...
- 攻防世界 ics-06
ics-06 进入题目有点吓人,不过我都点了一下发现只有报表中心可以进去 进入报表中心在url中发现?id=1,一开始以为是sql注入结果啥也没探测到,这题脑洞有点,没有任何提示直接爆破id即可获得f ...
- cpu设计过程
一款CPU是如何设计出来的? 前面一段,我们了解了芯片的制造过程,也就是如何从沙子中提取硅.把硅切成片,在片上通过离子注入实现PN结.实现各种二极管.三极管.CMOS管.从而实现千万门级大规模集成电路 ...
- AGENS算法
3.2 层次方法 下图,上面是从左到右由5个簇逐渐合并成1个簇的过程,下面是从右到左由一个簇逐渐分裂成5个簇的过程 AGENS算法 最后面一句话是重点,假设有<A,B>,<C,D&g ...
- Hive进行数据统计时报错：org.apache.hadoop.mapreduce.v2.app.MRAppMaster: Error starting MRAppMaster
报错详情: 2020-04-09 22:56:58,827 ERROR [Listener at 0.0.0.0/45871] org.apache.hadoop.mapreduce.v2.app.M ...
- java中的访问控制有什么用？如何用法？请举例
9.访问控制 [新手可忽略不影响继续学习] 访问控制有什么用?在软件公司里是这么用的,我们想像一种场景,在你的类中,你编了三个私有方法,马克-to-win,别人当然都用不了,但在类外,你也是用不了的, ...