原创js自动补全---auotocomplete
- if ($("input.autocomplete_input").length > 0) {
- $("input.autocomplete_input").bind('focus keydown', function (event) {
- if ($(this).parent('div').prev('div').find('div.help-block').html() != '') {
- $(".autocomplete-menu").css('top','167px');
- } else {
- $(".autocomplete-menu").css('top','142px');
- }
- var value = $(this).val();
- autocomplete('<?=Url::toRoute(['ajax-auto-complete'])?>', value, 1, this.getAttribute('name'));
- });
- $("input.autocomplete_input").on('blur', function (event) {
- window.setTimeout(function(){$(".autocomplete-menu").empty();$(".autocomplete-menu").hide();},200);
- });
- }
- function sureValue(obj, inputName) {
- var userId = $(obj).attr('data-id');
- var userName = $(obj).attr('data-name');
- $("input[name='" + inputName + "']").val(userName);
- $("#autocomplete-hidden-id").val(userId);
- }
- function autocomplete(url, data, type, inputName) {
- $(".autocomplete-menu").empty();
- jQuery.ajax({
- type: 'POST',
- data: {'key': data, 'type': type},
- url: url,
- dataType: 'json',
- success: function (da) {
- if (da.length > 0) {
- for (var p in da) {
- var name = da[p].realname ? da[p].realname : da[p].username;
- var chilren = '<a class="autocomplete-dataset " onclick="sureValue(this, \'' + inputName + '\')" data-id="' + da[p].id + '" data-name="' + name + '">' + da[p].username + '---' + da[p].realname + '</a>';
- $(".autocomplete-menu").append(chilren);
- }
- }
- $(".autocomplete-menu").show();
- },
- error: function(XMLHttpRequest, textStatus, errorThrown){
- // alert(XMLHttpRequest.status);
- // alert(XMLHttpRequest.readyState);
- // alert(textStatus);
- }
- });
- }
原创js自动补全---auotocomplete的更多相关文章
- js自动补全空白列(即缺少td的列)
//自动补全空白列 var rows = document.getElementById("gridTable").rows; //行对象 var allcells = rows[ ...
- js自动补全实例
var oInputField ,oPopDiv , oColorsUl,aColors; //初始化变量 function initVars(modelId,divId,ulId){ oInputF ...
- js自动补全
<!doctype html> <html> <style> body { margin-left: 0px; margin-top: 0px; margin-ri ...
- Visual Studio Code使用typings拓展自动补全功能
转自:http://blog.csdn.net/liyijun4114/article/details/51658087 参考来源: 官方介绍: https://code.visualstudio.c ...
- js邮箱自动补全
邮箱自动补全js和jQuery html: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...
- jquery input 搜索自动补全、typeahead.js
最近做个一个功能需要用到自动补全,然后在网上找了很久,踩了各种的坑 最后用typeahead.js这个插件,经过自己的测试完美实现 使用方法:在页面中引入jquery.jquery.typeahead ...
- jQuery搜索框自动补全功能插件实现-autocomplete.js
最近用nodeclub实现股票的输入关键字自动补全股票信息进行搜索功能,原先用jQuery-ui,结果jQuery-ui库太大,所以考虑用其他插件,最终选择使用autocomplete.js,控件简单 ...
- jQuery 邮箱下拉列表自动补全
综述 我想大家一定见到过,在某个网站填写邮箱的时候,还没有填写完,就会出现一系列下拉列表,帮你自动补全邮箱的功能.现在我们就用jQuery来实现一下. 博主原创代码,如有代码写的不完善的地方还望大家多 ...
- jQuery AutoComplete 自动补全
jQuery.AutoComplete是一个基于jQuery的自动补全插件.借助于jQuery优秀的跨浏览器特性,可以兼容Chrome/IE/Firefox/Opera/Safari等多种浏览器. 特 ...
随机推荐
- DOM操作中,getElementByXXXX 和 querySelector 的区别
1. 返回值: getElements返回动态集合: 优: 首次查找效率高 缺: 可能造成反复查找DOM树 querySelector返回非动态集合: 优 ...
- OpenStack搭建遇到的问题
前言:对于像我这种新手来说,搭建OpenStack真的很费劲,因为我总是每配置一个服务,我就想弄懂,后来搭建过程很累人,因此我想了个办法,等我搭建出来再学.我这里将记录我从开始之初到我学习,再到我毕业 ...
- HDU 1317XYZZY spfa+判断正环+链式前向星(感觉不对,但能A)
XYZZY Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Subm ...
- NYOJ 417 死神来了 鸽巢原理
死神来了 时间限制:1000 ms | 内存限制:65535 KB 难度:3 描述 有一天,王小子在遨游世界时,遇到了一场自然灾害.一个人孤独的在一个岛上,没有吃的没有喝的.在他饥寒交迫将要死亡时 ...
- gis电子地图开发公司面临的挑战和机遇
从上个世纪90年代开始电子地图应用就已经收到人们的关注,但是由于时代的局限性和市场经济发展的不成熟.地理信息系统系统的应用并没有得到很好的利用.只有少数的国家机构和军事系统才能够使用这些应用.随着技术 ...
- PostgreSQL启动main函数都干了什么(一)
DB Version:9.5.3 环境:CentOS7.x 调试工具:GDB source:src/backend/main/main.c 56 /* 57 * Any Postgres server ...
- Golang学习--包管理工具glide
上一篇文章中我们已经成功的运行了go的代码,这是我们迈出的最基础的一步. 一个项目通常会依赖很多外部的库,当依赖的库比较多的时候,手工管理就会比较麻烦,这个时候就需要包管理工具出场了,帮你管理好所有依 ...
- springCloud zuul网关服务
第一步:编写application.properties文件 spring.application.name=api-gateway server.port=5555 zuul.routes.user ...
- Python的列表
1. Python的列表简介 1. 1 列表的定义 列表是Python中最基本的数据结构,列表是最常用的Python数据类型,列表的数据项不需要具有相同的类型.列表中的每个元素都分配一个数字 ,即它的 ...
- Python爬虫(十二)_XPath与lxml类库
Python学习指南 有同学说,我正则用的不好,处理HTML文档很累,有没有其他的方法? 有!那就是XPath,我们可以用先将HTML文档转换成XML文档,然后用XPath查找HTML节点或元素. 什 ...