原创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等多种浏览器. 特 ...
随机推荐
- 变位词(0029)-swustoj
变位词(0029)水题 变位词如果两个单词的组成字母完全相同,只是字母的排列顺序不一样,则它们就是变位词,两个单词相同也被认为是变位词.如tea 与eat , nic 与cin, ddc与dcd, a ...
- Mysql第一周
前言:好久不见,我又来写博客拉.上个月只写了几篇django-rest-framework的,而且还是根据官网的英文写的.干货不多,内心还是有点羞耻的…… 简单说下我11月去干嘛了.11月初美图给我发 ...
- 数据库—Mysql
今天跟大家来聊聊Mysql,首先介绍一下它的历史: Mysql是一个关系型数据库管理系统,最先由瑞典的MySQL AB公司开发,后来被sun公司收购,后因sun公司又被Oracle公司收购,致使MyS ...
- Office 365系列 (1)概览:完整的云中Office
Office365(以下简称O365)是一个集Office,企业邮箱,日历,日程管理,音视频会议 ,企业网盘 ,企业协作平台为一体的,旨在提高团队办公效率,减少基础设施投资和IT运维压力的解决方案.在 ...
- POJ3083 Children of the Candy Corn(Bfs + Dfs)
题意:给一个w*h的迷宫,其中矩阵里面 S是起点,E是终点,“#”不可走,“.”可走,而且,S.E都只会在边界并且,不会在角落,例如(0,0),输出的话,每组数据就输出三个整数,第一个整数,指的是,以 ...
- 《Clean Code》 代码简洁之道
作者介绍 原文作者: Robert C. Martin, Object Mentor公司总裁,面向对象设计.模式.UML.敏捷方法学和极限编程领域的资深顾问,是<敏捷软件开发:原则.模式.与实践 ...
- pymysql实现MySQL与Python交互
常见MySQL操作 所需模块: pip3 install pymysql 查询(fetchone,fetchmany,fetchall): import pymysql #连接 con = pymys ...
- NOIP2012junior—P1—质因数分解
NOIP2012junior-P1-质因数分解 时间: 1000ms / 空间: 131072KB [背景] NOIP2012[描述] 已知正整数n 是两个不同的质数的乘积,试求出较大的那个质数. [ ...
- 使用Jenkins自动部署博客
title: 使用Jenkins自动部署博客 toc: true comment: true date: 2017-12-17 19:48:10 tags: ['Jenkins', 'CI'] cat ...
- WPF依赖对象(DependencyObject) 实现源码,理解WPF原理必读
/// DependencyObject encompasses all property engine services. It's primary function /// is providin ...