关于类似于自动填充搜索框的DEMO
接了个单子,客户要求左边输入时,右边自动到数据库查出对应内容,如果是单个INPUT还好,这个是动态增加INPUT,不过都是一样,关键是思路
这里遇到最郁闷的问题,就是我用的JQ1.9 以前用的JQ1.3~1.7我擦。。绑定老是用live 结果1.9有个兼容,用jqobj.on('event',func)
JQ等一系列的框架太强大了。。。。开发效率高了,学习门槛低了,大家有什么感想呢。。。。
<html>
<script src="jquery190.js"></script>
<body>
<div id="list" style="width:900px;background: brown;">
</div>
<br>
<div id="btn_domain" style="width:900px;background: #red;">
<input type="button" value="add" id="btn_add">
</div> <script>
$(function(){ var DemoBase = {
//生成序列种子,为每一次ADD的input添加编号
listNumber:0,
bindEvt:function(){ var obj = $("#s"+DemoBase.listNumber);
var tObj = $("#t"+DemoBase.listNumber); obj.on('keyup',function(){
tObj.html($(this).val()); });
} }; //点击add按钮时
$("#btn_add").click(function(){ var htm = "<div id='left' style='float: left;width: 50%;height: 40px;'>cate:<input id=s"+DemoBase.listNumber+"></div>";
htm+="<div id='right' style='float: left;width: 50%;height: 40px;'><span id=t"+DemoBase.listNumber+">listen</span></div>"; $("#list").append(htm);
//为新添加的input绑定事件
DemoBase.bindEvt();
DemoBase.listNumber++; }); });
</script> </body>
</html>
关于类似于自动填充搜索框的DEMO的更多相关文章
- 使用jQuery-UI来实现一个Ajax的自动完成功能(自动填充搜索框的下拉值)
首先你要在.net拓展包中去搜索 jquery ui (Combined Libray)安装这么个文件 第二部 在控制器中添加我们根据输入搜索框的值获取符合的记录集的action 第三步 有了 ...
- 分享一个jquery写的类似于百度的搜索框,(可动态配置,可单列或者table格式,可填充数据)
需求:类似于百度的搜索框,可配置,可单列可table格式,可填充数据.页面可多次使用,简单,易用. 想法:使用jquery,css,ajax,前台调用,后台返回json数据. jquery代码: va ...
- Ajax以及类似百度搜索框的demo
public class Ajax01 extends HttpServlet{ @Override protected void service(HttpServletRequest request ...
- JS实现日历控件选择后自动填充
最近在做人事档案的项目,在做项目的初期对B/S这块不是很熟悉,感觉信心不是很强,随着和师哥同组人员的交流后发现,调试程序越来越好了,现在信心是倍增,只要自己自己踏实的去研究.理解代码慢慢的效果就出来了 ...
- 使用 jquery-autocomplete插件 完成文本框输入自动填充联想效果 解决兼容IE输入中文问题
项目中有时会用到ajax自动补全查询,就像Google的搜索框中那样,输入汉字或者字母的首个字母,则包含这个汉字或者字母的相关条目会显示出来供用户选择,该插件就是实现这样的功能的.autocomple ...
- (八)solr7实现搜索框的自动提示并统计词频
solr7实现搜索框的自动提示并统计词频 1:用solr 的suggest组件,统计词频相对麻烦. 2:用TermsComponent,自带词频统计功能. Terms组件提供访问索引项的字段和每个词 ...
- input框自动填充内容背景颜色为黄色解决方法
谷歌浏览器input自动填充内容,背景色会是黄色,想改的话: input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset;} 这种方 ...
- chrome下input文本框自动填充背景问题解决
chrome下input文本框会自动填充背景,只需要给文本框加一个样式即可解决问题 input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px ...
- 解决input框自动填充为黄色的问题
题原因:input 框会自动填充一个颜色 如图所示 解决方法 :通过动画去延迟背景颜色的显示 代码如下 input:-webkit-autofill, textarea:-webkit-auto ...
随机推荐
- C++中的随机数函数(
标签:ul 随机数 c 整数 max 教育 C++中产生随机数种子对于刚開始学习的人一直都非常困惑.大家知道,在C中有专门的srand(N)函数能够轻松实现这一功能,然而在C++中则要复杂一些.以下 ...
- 音乐ID3 中 专辑封面解析(APIC帧)
ID3V2 中 APIC 帧标识 专辑封面.前几天 百度 谷歌 都没有找到具体的说明.有点小伤人. 最好参考 Android 中的 id3.cpp 以及一个java 开源 id3 库.找到这里的规格 ...
- text选中后displa出label内容
效果很好而且很简单 用text的click属性即可 private sub text1_click()label1.caption="******"label2.caption=& ...
- java中关于SSL/TSL的介绍和如何实现SSL Socket双向认证
一. SSL概述 SSL协议采用数字证书及数字签名进行双端实体认证,用非对称加密算法进行密钥协商,用对称加密算法将数据加密后进行传输以保证数据的保密性,并且通过计算数字摘要来验证数据在传 ...
- 创建一个支持异步操作的operation
NSOperationQueue时iOS中常用的任务调度机制.在创建一个复杂任务的时候,我们通常都需要编写NSOperation的子类.在大部分情况下,重写main方法就可以满足要求.main方法执行 ...
- Unity5UGUI 官方教程学习笔记(二)Rect Transform
Rect Transform Posx Posy Posz : ui相对于父级的位置 Anchors :锚点 定义了与父体之间的位置关系 一个锚点由四个锚组成 四个锚分别代表了 ...
- WSDL规则解释(转)
转自:http://www.blogjava.net/baoyaer/articles/116413.html WSDL文档可以分为两部分.顶部分由抽象定义组成,而底部分则由具体描述组成.抽象部分以独 ...
- java——数据库——commons-DbUtils
Apache Commons DbUtils Tutorial The Apache Commons DbUtils library is a small set of classes designe ...
- Do not go gentle into that good night
Do not go gentle into that good night By:Dylan Thomas Do not go gentle into that good night,Old ag ...
- JSP三大常用对象request、response、session
1.request对象 客户端的请求信息被封装在request对象中,通过它才能了解到客户的需求, 然后做出响应.它是HttpServletRequest类的实例. 序号方法说明 objectgetA ...