如何使用自動回復<select><option>通過ajax搜索

Question

我正在嘗試通過 ajax 進行自動搜索，但輸入在select option標簽內

 $(document).ready(function(){ var searchForm = $('.search-form') var searchInput = searchForm.find("[name='invoice_no']") var typingTimer; var typingInterval = 100 searchInput.keyup(function(e){ console.log(searchInput.val()) }) })

 <form method="GET" class="search-form"> <div> <div class="w-full px-2 md:w-3/12 mt-5 whiteBG py-1 mx-auto rounded-lg"> <select name="invoice_no" class="selectpicker text-black text-center" data-show-subtext="true" data-live-search="true" class='text-center'> <option value="" selected='true' disabled='true' class='text-center'>search</option> <option value="one" class='text-center'>one</option> <option value="two" class='text-center'>two</option> </select> <button><i class="fas fa-search text-lg grayCOLOR ml-5"></i></button> </div> </div> </form>

但什么也沒顯示！ 有什么我應該改變的嗎？

Answer 1

keyup() 事件和 change() 事件的區別

$(document).ready(function(){
    var searchForm = $('.search-form')
    var searchInput = searchForm.find("[name='invoice_no']")
    // var typingTimer;
    // var typingInterval = 100
    searchInput.change(function(e){
      console.log(searchInput.val())
    })
  })