首頁 > web前端 > js教程 > javascript input輸入框模糊提示功能詳解

javascript input輸入框模糊提示功能詳解

巴扎黑
發布: 2018-05-15 14:36:42
原創
2599 人瀏覽過

這篇文章主要介紹了javascript input輸入框模糊提示功能的實現的相關資料,希望透過本能幫助到大家,需要的朋友可以參考下

javascript input輸入框模糊提示功能的實作

主要用到了jQuery.autocomplete函數,定義好一個陣列就可以用這個功能了,很方便。

<!doctype html>
<html>
<head>
 <meta charset="utf-8">
 <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="external nofollow" >
 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
 <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
 <script>
 $(function() {
  var availableTags = [
   "James",
   "Kobe",
   "Jordan"
  ];
  $( "#tags" ).autocomplete({
   source: availableTags
  });
 });
 </script>
</head>
<body>

<p class="ui-widget">
 <label for="tags">Tags: </label>
 <input id="tags">
</p>

</body>
登入後複製

效果:

#

以上是javascript input輸入框模糊提示功能詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板