微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Jquery 实时搜索

思路:给输入框绑定两个事件,一个键盘按下另一个键盘抬起,按下时记录上一个值,抬起时获取新输入的值,将二者长度进行对比如果有改变则发起请求。最后将请求的结果放到datalist标签进行展示以供选择。

html

<input type="text" class="form-control" list="cars" onkeyup="keyUp(this)" onkeydown="keydown(this)"/>
<datalist id="cars">
    <option v-for="(v,i) in customerTemp.managerInfoList" :value="v">{
  {v}}</option>

</datalist>

js

var vm = new Vue({
    el:'#baseinfo',
    data:{
        customerTemp.managerInfoList: []
    }
)}
var oldValue = "";
function keyUp(obj){
    let newValue = obj.value;
    if (newValue.length > oldValue.length){
        console.log("发起请求:"+newValue);
        //模拟后端返回数据
        vm.customerTemp.managerInfoList 

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐