1、body里面的内容

<input type="text" class="inputTxt" id="txtJigou" autocomplete="off"/>

2、引入jquery.ui.min.js和他的样式

3.js代码如下<script type="text/javascript">

	$(function(){
$("#txtJigou").autocomplete({
source: function( request, response ) {
$.ajax({
url: "/Home/Organization/getList.html",
dataType: "json",
data: {
"name": "中","typeid":"11"
},
success: function( data1 ) {
if(data1.state==1){
//data1返回json格式如下
response(data1.data);
}
}
});
},
minLength:1,
autoFocus:true,
focus: function( event, ui ) {
$( "#txtJigou" ).val( ui.item.company );
return false;
},
select: function( event, ui ) {
$( "#txtJigou" ).val( ui.item.company );
return false;
}
}).autocomplete( "instance" )._renderItem = function( ul, item ) {
        //这里是自定义显示的数据,我需要显示的数据是上面的data1.data
return $( "<li>" )
.append( "<a>" + item.company + "<br>" + item.desc + "</a>" )
.appendTo( ul );
};
});
</script>

  

4、返回JSON的数据如下

   {
"state": 1,
"data": {
"10013": {
"id": "10013",
"company": "金谷信托",
"alias": "中国金谷国际信托有限责任公司"
},
"11031": {
"id": "11036",
"company": "民生信托",
"alias": "中国民生信托有限公司"
}
}
}

  

jquery ui autocomplete ajax返回数据自定义显示的更多相关文章

  1. jQuery ui autocomplete下拉列表样式失效解决,三种获取数据源方式,

    jQuery有很多很多的已经实现,很漂亮的插件,autocomplete就是其中之一.jQuery ui autocomplete主要支持字符串Array.JSON两种数据格式,jQuery ui b ...

  2. jQuery UI Autocomplete是jQuery UI的自动完成组件(share)

    官网:http://jqueryui.com/autocomplete/ 以下分享自:http://www.cnblogs.com/yuzhongwusan/archive/2012/06/04/25 ...

  3. jQuery UI Autocomplete是jQuery UI的自动完成组件

    支持的数据源 jQuery UI Autocomplete主要支持字符串Array.JSON两种数据格式. 普通的Array格式没有什么特殊的,如下: ? 1 ["cnblogs" ...

  4. Jquery ui autocomplete简单api

    重要说明:与配置选项类似,Autocomplete插件的方法也不是直接调用,而且通过autocomplete()方法进行间接调用.例如: $("#title").autocompl ...

  5. 160620、利用 jQuery UI 和 Ajax 创建可定制的 Web 界面

    如今,网站比以往更具可定制性,允许用户更改其空间,根据自己的喜好对其进行个性化.个性化的主页或仪表板页面(例如 iGoogle.MyYahoo! 和 MyAOL)日渐普及,大多数 Web 应用程序内甚 ...

  6. jQuery UI AutoComplete的使用

    现场提出优化单,Table Mapping里关于获取数据源下所有表名的地方由于表数量过多选择不便,需添加搜索功能.原本的实现是一个Dialog ,现打算将其改为AutoComplete. 框架使用的是 ...

  7. jquery ui autocomplete 实现点击文本框,出现所有查询信息效果,与bootstrap结合使用修改样式

    直接看代码 <!doctype html> <html lang="en"> <head> <meta charset="utf ...

  8. jQuery.ui autoComplete使用

    官网  http://api.jqueryui.com/autocomplete/#option-source 参考了 http://www.cnblogs.com/lwme/archive/2012 ...

  9. Node.js配合jQuery UI autocomplete的应用

    Node.js擅长的领域为: 不需要很多运算 吞吐量要求高 进消息轻并且要求快 出消息轻并且要求快 网上的例子都是socket.io的,我一直在想到底能用在什么地方?根据node.js的优点(擅长领域 ...

  10. Jquery UI Autocomplete 在mvc中应用

    首先添加引用 <link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" type ...

随机推荐

  1. Fabric网络升级(三)

    原文来自这里. 如果不熟悉capability,那么操作前可以查阅Capabilities.需要注意的是在启用capabilities前,需要升级归属该通道的peer节点和排序节点. 更多关于最新版F ...

  2. 推荐系统[三]:粗排算法常用模型汇总(集合选择和精准预估),技术发展历史(向量內积,Wide&Deep等模型)以及前沿技术

    1.前言:召回排序流程策略算法简介 推荐可分为以下四个流程,分别是召回.粗排.精排以及重排: 召回是源头,在某种意义上决定着整个推荐的天花板: 粗排是初筛,一般不会上复杂模型: 精排是整个推荐环节的重 ...

  3. node版本控制工具nvm安装教程

    一.安装nvm 查看node对应NPM:https://nodejs.org/en/about/previous-releases 1.卸载node,后删除node文件夹里的所有内容 2:安装nvm管 ...

  4. 如何在 macOS Sonoma 虚拟机中安装 VMware Tools

    vmware-tools VMware Tools 简介 VMware Tools 中包含一系列服务和模块,可在 VMware 产品中实现多种功能,从而使用户能够更好地管理客户机操作系统,以及与客户机 ...

  5. 架构设计脱胎换骨!英特尔酷睿Ultra深度解析

    英特尔正式发布了第一代酷睿Ultra处理器平台,也就是首个基于Intel 4制程工艺(7nm)打造的移动级处理器平台,其核心代号为Meteor Lake,产品系列贴标设计也采用了全新方案. 同时在命名 ...

  6. korean doll likeness模型|Japanese-doll-likeness模型获取及使用

    1.模型 之前给大家写了Mac安装stable-diffusion-webui绘制AI妹子保姆级教程,教程在下面 [奶奶看了也不会]AI绘画 Mac安装stable-diffusion-webui绘制 ...

  7. Hive-beeline连接报错:root is not allowed to impersonate root (state=08S01,code=0)

    问题描述 使用hive/bin目录下的hive启动客户端,使用!connect jdbc:hive2://hadoop01:10000连接Hive数据仓库时提示输入用户名和密码,输入数据库的用户名和密 ...

  8. python课本学习第六章

    一.字典的概念 #示例代码 student = {'name':'xx','name':'yy','grade1':98.1,'grade':99.2} print(student) #output: ...

  9. SpringBoot整合Swagger2实现接口文档

    展示一下 访问方式一 访问地址:http://localhost:8080/swagger-ui.html#/ 首页 详情页 访问方式二 访问地址:http://localhost:8080/doc. ...

  10. pyhotn3.8 apt机器基础镜像构建

    FROM python:3.8.10-slim RUN sed -i 's/deb.debian.org/mirrors.tuna.tsinghua.edu.cn/g' /etc/apt/source ...