关于类似于自动填充搜索框的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 ...
随机推荐
- php使用check box
if (isset($_POST['submit'])) { foreach ($_POST['todelete'] as $delete_id) { //这里是循环遍历这个数组 todelete 每 ...
- 应用java多线程实现server端与多client之间的通信
应用多线程来实现server与多线程之间的通信的基本步骤 1.server端创建ServerSocket,循环调用accept()等待client链接 2.client创建一个Socket并请求和se ...
- xcode xib 加载 、注意点
加载xib2中方式 NSArray *array = [[NSBundle mainBundle] loadNibNamed:@"xib名称" owner:nil options: ...
- DataTable转换实体类
using System;using System.Collections.Generic;using System.Text;using System.Data;using System.Data. ...
- ##DAY10 UITableView基础
##DAY10 UITableView基础 UITableView继承于UIScrollView,可以滚动. UITableView的每⼀条数据对应的单元格叫做Cell,是UITableViewCel ...
- MySQL中的insert ignore into, replace into等的一些用法小结(转)
MySQL中的insert ignore into, replace into等的一些用法总结(转) 在MySQL中进行条件插入数据时,可能会用到以下语句,现小结一下.我们先建一个简单的表来作为测试: ...
- python 缩进导致的问题
今天写Python 看着没有问题 运行就各种问题 object has no attribute 最后发现 Vim 设置里面有个 tabstop 我设置的是4 应该设置成8
- 本地搭建php环境
AppServ 是 PHP 网页架站工具组合包,所包含的软件有:Apache[.Apache Monitor.PHP.MySQL.phpMyAdmin等,如果您的本地机器没有安装过php.mysql等 ...
- sql发邮件
DROP PROCEDURE USP_CheckProductCodeRepeatAndSendMail go ---检查商家是否有重复的商品编号,如果有则发送给系统配置中接收的用户邮箱 CREATE ...
- Vue.jsbrowserify项目模板
Vue.js——60分钟browserify项目模板快速入门 概述 在之前的一系列vue.js文章,我们都是用传统模式引用vue.js以及其他的js文件的,这在开发时会产生一些问题. 首先,这限定 ...