1. 爱易网页
  2. AJAX教程
  3. ajax + jquery 兑现自动完成autocomplete

ajax + jquery 兑现自动完成autocomplete

日期：2014-05-16　 浏览次数：20652 次

ajax + jquery 实现自动完成autocomplete
Code:
  1. <script???src= "${pageContext.request.contextPath}/js/jquery-1.5.1.js" >??
  2. </script>??
  3. ????????<script?type="text/javascript" ??
  4. ????????????src="${pageContext.request.contextPath}/js/jquery-ui-1.8.13.custom.min.js" >??
  5. </script>??
  6. ????????<link?rel="stylesheet" ?type= "text/css" ??
  7. ????????????href="${pageContext.request.contextPath}/css/jquery-ui-1.8.13.custom.css" ?/>??

代码实现

Code:
  1. <script?type= "text/javascript" >??
  2. var ?nameDate?=? "" ;??
  3. function ?onLoadMsg()?{??
  4. ???$("#cusName" ).autocomplete(?{??
  5. ????????autoFill?:?false ,??
  6. ????????matchContains:?true ,??
  7. ????????source?:?nameDate??
  8. ????});??
  9. ????var ?cusName?=?$( "#cusName" ).val();??
  10. ????jQuery.post("customer_nameSelect?cusName=" ?+?cusName,? function (data)?{??
  11. ????????nameDate?=?data;??
  12. ????});??
  13. ??????
  14. ??????
  15. }??
  16. function ?onShow(){??
  17. }??
  18. $().ready(function ()?{??
  19. });??
  20. </script>??

页面文件触发

Code:
  1. <input?type= "text" ?id= "cusName" ?name= "entity.customners.id" ??
  2. ????????????????????????????????????????onkeypress="onLoadMsg()" ?onkeyup= "onShow()" >??

效果图

相关资料更多>

  1. jQuery中应用AJAX跨域操作
  2. 自各儿封装的一个juery ajax封装方法
  3. AJAX小小结
  4. Jquery+Ajax 联动刷新被重置
  5. 聚美优品 登陆框样式 求教解决方案
  6. jquery的赋值有关问题
  7. jQuery ajax获取strut2.0action 返回List<Map<Object,Object>>
  8. 请问一个级联操作有关问题
  9. 数据库操作进度条有关问题