关于类似于自动填充搜索框的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 ...
随机推荐
- android 强制设置横屏 判断是横屏还是竖屏
判断activity 是横屏还是竖屏 方法 1: //根据设备配置信息 Configuration cf= this.getResources().getConfiguration(); //获取设 ...
- BZOJ 2716 Violet 3 天使玩偶 CDQ分治
题目大意:初始给定平面上的一个点集.提供两种操作: 1.将一个点增加点集 2.查询距离一个点最小的曼哈顿距离 K-D树是啥...不会写... 我仅仅会CDQ分治 对于一个询问,查询的点与这个点的位置关 ...
- VisualStudio中的代码段
VS很强大,在这里就不过多说了,在平时码代码时应用代码段会提高我们的编写速度. 举个例子: 比如输入Console.WriteLine (); 传统方法就是一个字母一个字母的输入进去. 如果大家掌握了 ...
- Javascript 自定义事件 (custom event)
Javascript 中经常会用到自定义事件.如何创建一个简单的自定义事件呢?在创建自定义的事件之前,我们应该考虑一下和事件有关的东西.例如 click 事件,首先我们要能注册一个click事件(在一 ...
- ViewPager引导
1.首先要导入android-support.v4.jar第三方工具包 2.activity_guid.xml <RelativeLayout xmlns:android="http: ...
- Css 使div标签下沉到页面最低部
.footer{ position:fixed; bottom:0; } 使用这两个标签就能达到效果
- js获取当前年月日
function GetDate(){ var now = new Date(); var year = now.getFullYear(); //年var month = now.ge ...
- collectionView 中cell间距设置建议
应该是调节UICollectionViewFlowLayout的minimumInteritemSpacing属性,这个是调节同一行的cell之间的距离的. 使用-(CGFloat )collecti ...
- [Jobdu] 题目1506:求1+2+3+...+n
题目描述: 求1+2+3+...+n,要求不能使用乘除法.for.while.if.else.switch.case等关键字及条件判断语句(A?B:C). 输入: 输入可能包含多个测试样例. 对于每 ...
- Android webViewj简单处理apk的下载链接
最近在开发二维码扫一扫的功能,需要分多种情况处理外部的url.遇到一个问题是,一些程序包(比如一些android应用)的下载不好处理.如果不做任何处理的话,webView会打开一个空白页.比如这个链接 ...