input搜索框的搜索功能

如图,想要实现输入关键词,点击搜索按钮或者回车键都能进行搜索并返回。

html部分代码如下:

js部分——
function entersearch(){
var event = window.event || arguments.callee.caller.arguments[0];
if (event.keyCode == 13)
{
search();
}
}
function search(){
var con=$("#sear").val();
$.ajax({
url:"",
type:"get",
async : false,
contentType:"application/json;charset=UTF-8",
data:{"search":con},
dataType:"json",
success:function(data){
var searHtml="";
for(var i=0;i<data.length;i++){
var lv=data[i];
searHtml+="<li><a href='detail.html?id="+lv.id+"'><span class='itemText'>"+lv.t1+"</span><span class='itemPrize'>"+lv.price+"</span><a></li>";
}
$(".pullCon").html(searHtml);
},
error:function(){
console.log("搜索失败")
}
});
var divdisp=$(".pulldown").css("display");
if (divdisp == "block") {
$(".pulldown").css("display","none");
} else {
$(".pulldown").css("display","block");
}
最后一部分是实现再次点击button按钮隐藏下拉出来的搜索结果!
input搜索框的搜索功能的更多相关文章
- input搜索框实时检索功能实现(超简单,核心原理请看思路即可)
问题:实现input搜索框实时检索的功能,类似哔哩哔哩首页搜索功能(壮哉我大b站!).公司要求,emmmm没办法,果然懒人是要被赶着走才会进步的说,诶嘿O(∩_∩)O. 解决方法: 1.参考资料:ht ...
- 解决win10状态栏的搜索框无法搜索本地应用或无反应
今天突然出现的问题,在状态栏左下角的搜索框搜索OneNote没有任何反应. 1.首先,打开管理员命令窗口,win+x,可以看到弹出一个窗口,打开windows Powershell(管理员)如图 2, ...
- Win10任务栏搜索框无法搜索,显示白色页面
如果确定: Windows search服务启动打开 %LocalAppData%\Packages\windows.immersivecontrolpanel_cw5n1h2txyewy\Local ...
- win10桌面左下角搜索框无法搜索解决办法
方法1.首先看下window search服务是不是被禁止或者停止运行了,如果停止了,就重新启动看看. 方法2.如果上面的方法还没有解决的话:任务管理器-详细信息--结束explorer.exe进程- ...
- 搜索框focus 搜索面板显示 点击别处消失 从浏览器别的页面回来消失
开始是设置了回到页面使display:none(离开页面操作失效),但是发现回到页面,面板显示,dom获取却为null,于是做了个延时的处理 currentPage: function() { var ...
- java简单的实现搜索框的下拉显示相关搜索功能
最近做了一个简单的搜索框下面下拉显示相关搜索的功能,有点模仿百度的下拉展示相关搜索 先上个展示图 : 点击进入演示地址,大家可以输入长点的搜索,点击搜索,再输入之前搜索词的前面部分,看是否能展示出来 ...
- 微信小程序 —搜索框
wxSearch优雅的微信小程序搜索框 一.功能 支持自定义热门key 支持搜索历史 支持搜索建议 支持搜索历史(记录)缓存 二.使用 1.将wxSearch文件夹整个拷贝到根目录下 2.引入 // ...
- Ajax (jquery)实现智能提示搜索框(in Django)
搜索框输入搜索名字,从数据库中筛选名字, 如果有包含输入的字母的名字则以json格式返回并且显示在搜索框下: html文件: <!DOCTYPE html> <ht ...
- js之搜索框
目标效果:点击搜索框,搜索框内提示信息消失,可输入搜索信息,点击搜索框外搜索框如果没提示信息或者为空时,显示搜索框提示信息,如果有搜索信息,显示搜索信息. 代码如下: <!DOCTYPE htm ...
随机推荐
- 【python接口自动化】- openpyxl读取excel数据
前言:目前我们进行测试时用于存储测试数据的软件几乎都是excel,excel方便存储和管理数据,读取数据时也比较清晰,测试时我们需要从excel从读取测试数据,结束后还需把测试结果写入到excel中, ...
- 「雕爷学编程」Arduino动手做(11)——金属触摸模块
37款传感器和模块的提法,在网络上广泛流传,其实Arduino能够兼容的传感器模块肯定是不止37种的.鉴于本人手头积累了一些传感器与模块,依照实践出真知(动手试试)的理念,以学习和交流为目的,这里准备 ...
- django中ckeditor富文本编辑器使用
1.安装模块 (pillow是python的一个图像处理库) pip install django-ckeditor pip install pillow 2.编辑seetings.py配置文件 IN ...
- 在ORACLE中实现SELECT TOP N的方法----[转]
1.在ORACLE中实现SELECT TOP N 由于ORACLE不支持SELECT TOP语句,所以在ORACLE中经常是用ORDER BY跟ROWNUM的组合来实现SELECT TOP N的查询. ...
- 牛客网挑战赛19 B,C,F
链接:https://www.nowcoder.com/acm/contest/131/B来源:牛客网 矩阵 M 包含 R 行 C 列,第 i 行第 j 列的值为 Mi,j. 请寻找一个子矩阵,使得这 ...
- Palindromes _easy version(hdu2029)
输入格式:首先一个整型,然后循环不带空格未知长度的字符串. 思考:首先用scanf_s()输入整型,然后一个大循环,用gets_s()函数输入字符串. 注意:scanf_s()多加了一个%c,& ...
- Python小技巧:如何批量更新已安装的库?
众所周知,升级某个库(假设为 xxx),可以用pip install --upgrade xxx 命令,或者简写成pip install -U xxx . 如果有多个库,可以依次写在 xxx 后面,以 ...
- 记一次 React Native 大版本升级过程——从0.40到0.59
去年把公司几个react native 相关的项目升级了下,已经过去一段时间了,这里系统整理下之前的整个过程. 背景 之前到公司的时候发现公司用的还是0.40的版本,据了解,当时项目做的比较早,导航用 ...
- 当.Net成为大厂门槛代码小白该何去何从?
掌握.Net已成为进入大厂的通行牌.越来越多的互联网软件公司开始使用.Net Core,根据去年数据显示腾讯.网易.顺丰.携程.中通.申通.同程艺龙.微医.233网校.问卷星.金蝶等关键业务已经在往. ...
- Linux(二):VMware虚拟机中Ubuntu安装详细过程
Linux(二):VMware虚拟机中Ubuntu安装详细过程 目录 1 准备 2 安装 2.1 虚拟机的建立 2.2 虚拟机安装Ubuntu系统 2.3 虚拟机设置 3 完成 1 准备 1.操作系统 ...