码迷,mamicode.com
首页 > Web开发 > 详细

使用jQuery Autocomplete(自动完成)插件,结合ajax实现搜索框匹配

时间:2021-06-18 19:21:14      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:net   com   blog   cti   return   auto   select   自动完成   function   

原文: https://blog.csdn.net/qililong88/article/details/51941641

 

$("#language").autocomplete({
    // 静态的数据源
    source: [
        { label: "Chinese", value: 1, sayHi: "你好" },
        { label: "English", value: 2, sayHi: "Hello" },
        { label: "Spanish", value: 3, sayHi: "Hola" },
        { label: "Russian", value: 4, sayHi: "Привет" },
        { label: "French", value: 5, sayHi: "Bonjour" },
        { label: "Japanese", value: 6, sayHi: "こんにちは" },    
    ],
    select: function(event, ui){
        // 这里的this指向当前输入框的DOM元素
        // event参数是事件对象
        // ui对象只有一个item属性,对应数据源中被选中的对象
        $(this).value = ui.item.label;
        $("#lang_id").val( ui.item.value );
        $("#sayHi").html( ui.item.sayHi );
        
        // 必须阻止事件的默认行为,否则autocomplete默认会把ui.item.value设为输入框的value值
        event.preventDefault();     
    }
});

 

source: function(req, res) {
var result = null
  var data = {name: req[‘name‘]} $.ajax({
     data: data success:
function(response) {
      result = response
return res(result)      } }) }

focus: function () {
}

 

使用jQuery Autocomplete(自动完成)插件,结合ajax实现搜索框匹配

标签:net   com   blog   cti   return   auto   select   自动完成   function   

原文地址:https://www.cnblogs.com/zhijianzhizhen/p/14892506.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!