页面

<div class="manage-Car-add-info-sn">
<p style="width:25%; height:70%;float:left;text-align:right">设备SN编号:</p>
<form:input path="sn" id="sn" list="suggest_ul" class = "input_SN" type="text" />
<datalist id="suggest_ul"></datalist>

ajax

$("#sn").keyup(function(){
//如果文本框为空,不发送请求
if($("#sn").val().length == 0){
$("#suggest_ul").hide(0);
return false;
}
console.log($("#sn").val());
var url = "getDeviceSn";
var sn = $("#sn").val();
$.ajax({
type:"post",
url :url,
data: {"sn":sn},
datatype:"json",
success:function(json){
if(json){
$("#suggest_ul").show(0);
$("#suggest_ul").html(json);
}
}
})
})

controller

List<String> modelList = sectorService.getDeviceSn(sn);

StringBuffer sb = new StringBuffer();

for (String string : modelList) {

sb.append("<option>" + string + "</option>");

}

return sb.toString();

input ajax自动补全的更多相关文章

  1. jquery input 搜索自动补全、typeahead.js

    最近做个一个功能需要用到自动补全,然后在网上找了很久,踩了各种的坑 最后用typeahead.js这个插件,经过自己的测试完美实现 使用方法:在页面中引入jquery.jquery.typeahead ...

  2. jquery的输入框自动补全功能+ajax

    jquery的输入框自动补全功能+ajax 2017年05月10日 18:51:39 辣姐什么鬼 阅读数:1461 标签: web前端 更多 个人分类: web前端   内容参考网友文章写成,原博的链 ...

  3. Ajax和Json实现自动补全

    1.index.jsp <%@ page language="java" import="java.util.*" pageEncoding=" ...

  4. AJAX实现类似百度的搜索提示,自动补全和键盘、鼠标操作

    <script type="text/javascript"> $(document).ready(function(){ var highlightIndex = - ...

  5. autocomplete实现联想输入,自动补全

    jQuery.AutoComplete是一个基于jQuery的自动补全插件.借助于jQuery优秀的跨浏览器特性,可以兼容Chrome/IE/Firefox/Opera/Safari等多种浏览器. 特 ...

  6. bigautocomplete实现联想输入,自动补全

    bigautocomplete是一款Jquery插件.用它实现仿搜索引擎文本框自动补全插件功能很实用,使用也很简单,引入了插件之后写几行代码就可以实现,可以灵活设置. 先看效果图: 上图是通过ajax ...

  7. jquery.autocomplete自动补全功能

    项目实例: 一:js //SupplierAutoComplete.js $().ready(function () { $("#txtSupplier").autocomplet ...

  8. jquery 自动补全控件(支持IE6)待整理

    自动补全控件(兼容IE6):http://bassistance.de/ download地址:http://jquery.bassistance.de/autocomplete/jquery.aut ...

  9. bootstrap3-typeahead 自动补全

    很酷的一个自动补全插件 http://twitter.github.io/typeahead.js 在bootstrap中使用typeahead插件,完成自动补全 相关的文档:https://gith ...

随机推荐

  1. 从设计到实现,一步步教你实现Android-Universal-ImageLoader-缓存

    转载请标明出处,本文出自:chaossss的博客 Android-Universal-ImageLoader Github 地址 Cache 我们要对图片进行缓存.有两种方式:内存缓存和本地缓存. 这 ...

  2. 信息属性列表关键字 info.plist

    本文转载至  http://blog.csdn.net/zaitianaoxiang/article/details/6650491 本附录说明了那些可以在束和包的属性列表文件中定义的关键字. 束关键 ...

  3. 让vs只启动自己想调试的站点

    VS中里面多个WEB项目如何只启动一个? 每次启动时,右下角都会出现一堆的 网站有10来个.即使设置了默认启动项目, 但每次按F5启动,或者哪怕是在项目上右键启动新实例 右下角都会出现这一堆的站点 有 ...

  4. PHP定界符{}的作用

    说明: PHP解析一个字符串为"Hello,$World"时会自动解析$World. {}是方便让PHP更快的查找,它告诉PHP这里面就是变量,不用再判断是否是变量了. 例子: $ ...

  5. 【原创】学习CGLIB动态代理中遇到的问题

    代码清单1 CGLIB动态代理 package wulj.proxy.cglibProxy; import java.lang.reflect.Method; import net.sf.cglib. ...

  6. 2014-08-28——移动端web开发,基本Meta标签

    1.<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scal ...

  7. python获取当前目录路径和上级路径

    在使用python的时候总会遇到路径切换的使用情况,如想从文件夹test下的test.py调用data文件夹下的data.txt文件: . └── folder ├── data │ └── data ...

  8. matlab学习笔记之基础知识(一)

    一.两种特殊数据类型 1.元胞数组   元胞数组是MATLAB的一种特殊数据类型,可以将元胞数组看做一种无所不包的通用矩阵,或者叫做广义矩阵.组成元胞数组的元素可以是任何一种数据类型的常数或者常量,每 ...

  9. 解读mysql主从配置及其原理分析(Master-Slave)

    在windows下配置的,后面会在Linux下配置进行测试,需要配置mysql数据库同步的朋友可以参考下. 1.在主数据库服务器为从服务器添加一个拥有权限访问主库的用户:GRANT REPLICATI ...

  10. nginx基础系列

    centos中搭建nginx环境 nginx开机启动 nginx配置文件说明 nginx负载均衡配置 nginx upstream模块 nginx配置ssl nginx日志切割 nginx平滑升级