簡介：自動提示無非就是輸入框內容改變時，自動根據輸入的內容進行模糊查詢；

手動實現無非兩種方式，一種異步加載數據，根據獲取的內容異步加載到網頁相應位置，第二種同步獲取數據，然后異步根據輸入框的改變進行查詢；

異步由于得到的就是json很好處理，今天經過摸索倒是想到了另一種方法，有點奇葩，寫出來與大家分享，歡迎大家指點；

思路：采用第二種方法，同步獲取數據，用c標簽實現遍歷，然后進行判斷顯示；

相關js代碼：

function autoHintW(){$("#processList0").empty();var p="", q="", value="";q+="<c:if test='${users!=null }'>";q+=" <c:forEach items='${users }' var='vr'>";p = "";p+=" <li>";value = '${vr.USER_ID}_${vr.NAME }';p+=" <input type='radio' name='users' value="+value+">";p+=" <input type='checkbox' name='cusers' value='"+value+"'>";p+=" <label class='abc'>${vr.NAME }</label>";p+=" </li>";var xx = $("#tab0 input[type=text]").val();if(xx == "" || value.indexOf(xx) >= 0){$("#processList0").append(p);}q+=" </c:forEach>";q+="</c:if>";load(); }

相關網頁代碼：

<div id="tab0"><input type="text" style="margin-top: 10px;"/><ul id="processList0"><script>autoHintW();</script></ul> </div>

當然智能提示存在鼠標鍵盤事件，本來想用onchange的但是鼠標必須移開輸入框才會觸發，所以考慮用keyup，但是觸發太過頻繁，需要設置時間響應：

$("#tab0 input[type=text]").keyup(function(){setTimeout("autoHintW()",1000); }); $("#tab1 input[type=text]").keyup(function(){setTimeout("autoHintD()",1000); }); $("#tab2 input[type=text]").keyup(function(){setTimeout("autoHintR()",1000); });

?

?歡迎大家訪問我的博客：http://www.cnblogs.com/handsomecui/p/7235806.html

總結

以上是生活随笔為你收集整理的智能提示的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。