autocomplete（）效果出來？？？
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="utf-8">
? ? <title>搜索插件</title>
? ? <style type="text/css">
? ? ? ? #divtest
? ? ? ? {
? ? ? ? ? ? width: 282px;
? ? ? ? }
? ? ? ? #divtest .title
? ? ? ? {
? ? ? ? ? ? padding: 8px;
? ? ? ? ? ? background-color: Blue;
? ? ? ? ? ? color: #fff;
? ? ? ? ? ? height: 23px;
? ? ? ? ? ? line-height: 23px;
? ? ? ? ? ? font-size: 15px;
? ? ? ? ? ? font-weight: bold;
? ? ? ? }
? ? ? ? #divtest .content
? ? ? ? {
? ? ? ? ? ? padding: 8px 0px;
? ? ? ? ? ? background-color: #fff;
? ? ? ? ? ? font-size: 13px;
? ? ? ? }
? ? ? ? #divtest .content .tip
? ? ? ? {
? ? ? ? ? ? text-align:center;
? ? ? ? ? ? border:solid 1px #ccc;
? ? ? ? ? ? background-color:#eee;
? ? ? ? ? ? margin:20px 0px;
? ? ? ? ? ? padding:8px;
? ? ? ? ? ? display:none;
? ? ? ? }
? ? ? ? .fl
? ? ? ? {
? ? ? ? ? ? float: left;
? ? ? ? }
? ? ? ? .fr
? ? ? ? {
? ? ? ? ? ? float: right;
? ? ? ? }
? ? </style>
? ? <script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
? ? <script src="../js/jquery.min.js"></script>
? ? <script src="../js/jquery.autocompleter.min.js"></script>
? ? <script type="text/javascript" src="../js/jquery.autocompleter.js"></script>
? ? <script src="../js/main.js"></script>
</head>
<body>
<div id="divtest">
? ? <div class="title">
? ? ? ? <span class="fl">搜索插件</span>
? ? </div>
? ? <div class="content">
? ? ? ? <span class="fl">用戶名</span><br />
? ? ? ? <input id="txtSearch" name="txtSearch" type="text" />
? ? ? ? <div class="tip">
? ? ? ? </div>
? ? </div>
</div>
<script type="text/javascript">
? ? $(function () {
? ? ? ? var arrUserName = ["王五", "劉明", "李小四", "劉促明", "李淵", "張小三", "王小明"];
? ? ? ? $("#txtSearch").autocomplete(arrUserName,{
? ? ? ? ? ? minChars: 0, //雙擊空白文本框時顯示全部提示數據
? ? ? ? ? ? formatItem: function (data, i, total) {
? ? ? ? ? ? ? ? return "<I>" + data[0] + "</I>"; //改變匹配數據顯示的格式
? ? ? ? ? ? },
? ? ? ? ? ? formatMatch: function (data, i, total) {
? ? ? ? ? ? ? ? return data[0];
? ? ? ? ? ? },
? ? ? ? ? ? formatResult: function (data) {
? ? ? ? ? ? ? ? return data[0];
? ? ? ? ? ? }
? ? ? ? }).result(SearchCallback);
? ? ? ? function SearchCallback(event, data, formatted) {
? ? ? ? ? ? $(".tip").show().html("您的選擇是：" + (!data ? "空" : formatted));
? ? ? ? }
? ? });
</script>
</body>
</html>
2018-09-09
將? src 里 http 改成 https (可以不用全貼代碼)