前陣子在專案中用了jQuery AutoComplete Plugin,感覺甚好,我想將來很可能會繼續用在其他專案上,索性做了一個範例懶人包以備未來不時之需,利人也利已。(我預估自己大概下個月就會忘記這次是怎麼寫出來的,所以這個懶人包對我來說也粉重要)

放了一個線上的範例網頁讓大家試敲,你可以輸入電子類股的股票代號、中文/英文股票名稱,網頁會提供提示,選取後會在左邊填入股票代號、右邊填入中文名稱。如下圖剖析,其實它是用<ul><li>去建構清單,而我特別框出selectValue,extra,會呼應到稍後提到findValue()函數中取值的邏輯。

程式的簡單說明如下。

前端HTML中主要透過$("...").autocomplete()的方式在Textbox掛上自動完成功能:
(註: 原版的jquery.autocomplete.js有中文相容的問題,所以我用的是對岸網友修改過的版本,我自己則加了一個noCache參數。文件上說cacheLength設為1就不會做Cache,但我觀察結果似乎不然,也許是版本不同所致。當資料筆數很多時,Cache在Script Side的做法就會變得不合適,因此我加了一個參數鋸箭解決Cache問題。)

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jQuery自動輸入完成懶人包</title>
    <script src="jquery-1.3.2.js" type="text/javascript"></script>
    <script src="jquery.autocomplete.js" type="text/javascript"></script>
    <link href="jquery.autocomplete.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    input 
    {
        width: 60px;
        margin-left: 5px;
    }
    </style>
    <script type="text/javascript">
        $(function() {
//選項說明: http://docs.jquery.com/Plugins/Autocomplete/autocomplete#url_or_dataoptions
            $("#txtSymbol").autocomplete("ACDataSrc.aspx",
            {
                delay: 10,
                width: 120,
                minChars: 1, //至少輸入幾個字元才開始給提示?
                matchSubset: false,
                matchContains: false,
                cacheLength: 0, 
                noCache: true, //黑暗版自訂參數,每次都重新連後端查詢(適用總資料筆數很多時)
                onItemSelect: findValue,
                onFindValue: findValue,
                formatItem: function(row) {
                    return "<div style='height:12px'><div style='float:left'>" + row[0] +
                            "</div><div style='float:right;padding-right:5px;'>" +
                            row[1] + "/" + row[2] + "</div></div>";
                },
                autoFill: false,
                mustMatch: true //是否允許輸入提示清單上沒有的值?
            });
            function findValue(li) {
                if (li == null) return alert("No match!");
                $("#txtSymbol").val(li.extra[0]);
                $("#txtCName").val(li.extra[1]);
            }
        });
    </script>
</head>
<body>
<input type="text" id="txtSymbol" />
<input type="text" id="txtCName" readonly="readonly" style="background-color: #cccccc;" />
</body>
</html>

另外,我寫了一隻ACDataSrc.aspx負責餵資料: (為力求單純,股票資料是用字串列出股票清單,實務上應該會以資料庫查詢取代之)

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.IO;
 
public partial class jQueryAutoComp_ACDataSrc : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        //使用者目前輸入的文字預設以q傳入
        string q = Request["q"] ?? "";
        if (q.Length > 0)
        {
            DataTable t = getStockData();
            DataView dv = new DataView(t);
            //利用LIKE做查詢
            dv.RowFilter = "Key LIKE '" + q.Replace("'", "''") + "%'";
            dv.Sort = "Key, Symbol";
            List<string> lst = new List<string>();
            lst.Add("");
            foreach (DataRowView drv in dv)
            {
                DataRow r = drv.Row;
                //組裝出前端要用的欄位
                lst.Add(string.Format("{0}|{1}|{2}", r["key"], r["symbol"], r["cname"]));
                if (lst.Count >= 10) break;
            }
            //每筆資料間以換行分隔
            Response.Write(string.Join("\n", lst.ToArray()));
        }
    }
 
    private DataTable getStockData()
    {
        #region 股票代號
        string rawData = @"
1435    中福    C.F.C.Y.CORP.
1437    勤益    GTM
...省略...
8249    菱光    CSI  
9912    偉聯    AIC";
        #endregion
 
        //如果資料量未多到誇張,將DataTable Cached住
        string CACHE_KEY = "StkTable";
        if (Cache[CACHE_KEY] == null)
        {
            DataTable t = new DataTable();
            t.Columns.Add("Key", typeof(string));
            t.Columns.Add("Symbol", typeof(string));
            t.Columns.Add("CName", typeof(string));
            t.Columns.Add("EName", typeof(string));
            //測試時由字串取得資料,實務上會去查DB
            StringReader sr = new StringReader(rawData);
            string line = null;
            while ((line = sr.ReadLine()) != null)
            {
                string[] p = line.Split('\t');
                if (p.Length != 3) continue;
                //分別以Symbol, CName, EName作Key
                //輸入中英文及代號都可以查
                t.Rows.Add(p[0], p[0], p[1], p[2]);
                t.Rows.Add(p[1], p[0], p[1], p[2]);
                t.Rows.Add(p[2], p[0], p[1], p[2]);
            }
            //放入Cache,保存兩小時
            Cache.Add(CACHE_KEY, t, null, DateTime.Now.AddHours(2),
                System.Web.Caching.Cache.NoSlidingExpiration,
                System.Web.Caching.CacheItemPriority.Normal, null);
        }
        return Cache[CACHE_KEY] as DataTable;
    }
}

實作細節請大家看程式碼自行揣摩,應沒什麼深奧的學問在裡面。如果有什麼對程式架構或寫法方面的指教,歡迎提出來大家切磋。

想抓整包回去玩的朋友,請按這裡下載。


Comments

# by 清純

未用先推~很實用

# by Ark

2點建議 資料會有異動的話不合適用Cache (ACDataSrc.aspx) 可以用配上 webmethod 以json格式存 把DataTable轉為List<object> (List<List<string>>) JS反序列化後loop處理array

# by jquery 初心者

黑暗大大.... 請教一下! 不曉得您有沒有在thickbox 上面試過 autocomplete ! 我發現在thickbox 上 autocomplete 會跑不出來.... 搜尋了一下....應該是thickbox 有設定z-index 的關係! 不曉得你有沒有什麼解法呢?

# by DANNY

請問一下大大,因為我不太懂 asp 裡面的東西 我想知道最後 return Cache[CACHE_KEY] as DataTable; 這段,會丟出什麼資料,是陣列還是一串字串但有分隔符號,因為我要用jsp 來實作 可以舉例嗎 謝謝

# by Jeffrey

to DANNY, DataTable是.NET的特有物件,概念跟DB的Table很接近。你若是JSP,設法用JSP自己的方法,比照產生 key1|symbol1|cname1 key2|symbol2|cname2 key3|symbol3|cname3 格式的文字內容送回前端即可。

# by

這個世界因有人願意無私付出而變得美好! 謝謝你!

# by jane

想請問一下大大 因為會重覆使用自動完成欄位在不同頁面(不同層) 所以關於謂資料的ACDataSrc.aspx..如何改變他的位置?

# by Jeffrey

to jane, 不是很明白你的問題,用$("#txtSymbol").autocomplete("ACDataSrc.aspx", ...)的寫法,每次設定時可為不同的input設定不同的程式當資料來源,你只要分別為每個輸入欄位指定成適當的資料提供程式就可以了。不知這樣有解答你的疑惑嗎? 若沒命中,就要請你再提供更詳細的問題說明。

# by jane

不好意思 講低不夠清楚 我的意思是多個頁面都有用$("#txtSymbol").autocomplete("ACDataSrc.aspx", ...) 假設第一層有ACDataSrc.aspx跟defult.aspx及a資料夾 而a資料夾有test.aspx 在default.aspx使用當然沒問題,那test.aspx該怎麼引用? 另外想請問一下><如果想把他套用在floatlayer的input中 我該如何設定自動完成選單的顯示位置跟著動? 問題有點多><不好意思..很感謝你~~~

# by Jeffrey

to jane, 不知我有沒有誤會你的意思,a/test.aspx裡寫成"../ACDDataSrc.aspx"是否就可以解決不同層的問題? 至於Float Layer的問題,依我的理解,提示選單應該會動態依欄位的位置顯示,理論上會跟著動才對。

# by jane

恩恩~我有試過..但是他好像不吃"../" 希望不是我粗心錯了其他地方>< 另外動態移動滴問題已經解決嚕 很謝謝你回答我滴問題~~

# by

想請教怎麼把這個功能套用在gridview的templete textobx ? 編輯的時候可以產生autocomplete

# by

我找到怎麼在gridview edit templete 套用 autocomplete了。參考 http://stackoverflow.com/questions/415975/autocomplete-using-jquery-in-gridview 可是~~一按編輯時,該欄位原本的值就會被清空,我是套用你的程式,請問您有在那裡預設textbox value為空值嗎?

# by Jeffrey

to 凱,如果不限定只可輸入有提示的內容,把mustMatch設成false看看。

# by

Jeffrey,我想設定mustMatch=true,必須符合內容才不會把資料清空。 但我想在一開始時就給定資料,如我想設定一開始時是2049,這在你的程式字串裡是有符合的資料,但在一開始執行網頁時,2049便會被清空,不知是js哪裡設定的關係???

# by

抱歉,打錯,是2409,同時也發現是在 function hideResultsNow()裡的 if (v != input.lastSelected) { selectItem(null); } 請問要怎麼改,才不會讓預設值清空?

# by Jeffrey

to 凱,Good Job, 你追到Bug了! 試試修改成: if (v != input.lastSelected && input.lastSelected != undefined) { selectItem(null); } 我想應可解決問題。

# by

Jeffrey,好像不行呢,雖然預設值不會被清掉了,但mustMatch=true卻沒作用了,輸入不符合的字不會被清掉...... 另外想請教,程式怎麼判斷哪個是key值,以致於輸入股票代碼或中文,第一欄回傳的永遠的代碼? 抱歉,諸多問題.........

# by Jeffrey

to 凱,驗證了一下,真的有問題,抱歉了! 原本想用改動最少的方法處理,看來沒成功。想了個醜陋但有效的解法,在第135列: var origVal = input.value; hideResultsNow(); input.value = origVal; 至於永遠傳回代碼的關鍵在於findValue()中的$("#txtSymbol").val(li.extra[0]);, ACDataSrc.aspx.cs中的lst.Add(string.Format("{0}|{1}|{2}", r["key"], r["symbol"], r["cname"]));,其中r["key"]會採用代號、中文名、英文名三種各產生一筆(這樣子輸入代號或中英文名詞都可比對出來),而r["symbol"]在前端會對應到li.extra[0],而r["cname"]則對應到li.extra[1]。

# by

Jeffrey,我的行數好像跟你不太一樣,是像下面醬嗎? .blur(function() { // track whether the field has focus hasFocus = false; hideResults(); }); var origVal = input.value; hideResultsNow(); input.value = origVal; 我執行後,預設值又被清了..。 沒關係,我把mustMatch=false,存前在後端檢查一次就可以了。 另外,在別台連到測試網站或正式機,在textbox輸入後,會跳出安全性資訊的訊息: 「這個畫面同時含有安全性與非安全性的項目。要顯示非安全性項目?」,按是或否後,再次輸入,才能正常顯示Aotocomplete list 加入信任網站也沒用,有辦法把這個訊息去除嗎?

# by Jeffrey

to 凱, 這個畫面同時含有安全性與非安全性的項目。要顯示非安全性項目-->表示網頁中有些連結內容是http,有些是https,設法將其調成一致就可以避免前述警告。

# by

Jeffrey, 抱歉這麼久才回應。 我的網站全是用https連線,會出現這個訊息是在輸入autocomplete時。這個物件只能用http連線嗎? 每次輸入都會出現醬的訊息,一堆user來反應了 ><

# by Jeffrey

to 凱,這個做法是可以適用https的,會出現錯誤應是網頁中有某些元素的URL設成了http,建議你用Fiddler, HttpWatch或Firbug之類的工具觀察一下,看看到底是哪顆屎壞了一鍋粥?

# by kwi

你好 ~我下載了您的檔案~ 奇怪的是 直接執行後會有activeX的提示 ~IE但已變更為"暫時允許執行activeX" ~但在輸入文字框還是無法彈出選單 ~像您網頁上秀的結果 ~可以教我一下如何才能正常執行它嗎?搞了一天還是不行!>< 麻煩了!

# by Jeffrey

to kwi, 我猜你是否將檔案解開在本機資料夾後直接執行? 該程式需要後端程式提供資料,所以需要掛在IIS上或是放進ASP.NET網站專案才能順利執行。

# by VV

黑暗大大 您好: 下戴您的sample 後發現很好用,不過 我是初學jquery不到一週的人,除了會引用別人的javascript , 還沒有能力自己寫 , 因此不了解如何去修改成自己要的東西,目前我遇到二個大難題 , 問題一: 我的資料 由另一支autoComplete.aspx去資料庫撈回來 ,當撈回的有 300筆時 我的游標到不了最下方的位置 , 因此我需要加入scroll , 在網路上找到可以加入scroll的js 讓游標可以在 每個rows間移動 , 但這個js是確沒有傳Request.QueryString["q"] 的值讓我的autoComplete.aspx接收 我如何讓他傳呢, 問題二: 找到的資料只有一筆或無資料時 下方會有 一堆堆的undefined 的rows , 我希望可以用有scroll 的autocomplete 的js 加上您的自動帶回填入二個欄位的方法 , 要如何修改這二個javascript 呢 ?

# by Jeffrey

to VV,一般來說AutoComplete的選項不會太多,多半只不超過10筆,畢竟它多屬輔助文字輸入的性質。我個人不太建議讓提示項目超過10筆,若有類似情境,我應會試試其他做法。出現undefined資料,我猜是formatItem()函數跟後端的搭配有問題,可能要看程式碼才知道。

# by VV

謝謝您的回覆 不過我實在很無耐 我的user 堅持要用這個方法 ,現在是頭殼要抱去燒了.... 現在undifined 已處理掉了 , 只差 scroll 加不上去

# by kaihsin

黑暗大大您好 想請問 我在您的範例的ACDataSRC內看到您的註記寫道 "如果資料量未多到誇張,將DataTable Cached住" 想請問您的經驗,如何判斷資料量的大小 謝謝

# by Jeffrey

to kaihsin, 資料Cache起來會佔用Server端的記憶體,依我自己的經驗,若Web Server的記憶體並不吃緊,3,4萬筆資料都是可以被接受的大小。(但這非絕對的準則,仍要視個案的狀況而定)

# by 路人甲

在網路上看到 $("#states").autocomplete(url, { extraParams: { country: function() { return $("#country").val(); } } }); 可以帶入額外的 country 參數,是抓目前 id="country" 這個欄位的值 但是使用〔jQuery自動完成懶人包〕,卻無法取得 id="country" 這個欄位的值,只能取得 function() { return $("#country").val(); } 這一字串 可能是功力太淺,看過 autocomplete.js原始碼,還是不解,期望你能幫忙解決這一問題,在此先說聲謝謝

# by Jeffrey

to 路人甲,要帶入函數動態決定參數值,jquery.autocomplete.js要做點修改: function makeUrl(q) { var url = options.url + "?q=" + escape(q); //allow param and param() scenario $.each(options.extraParams, function (key, param) { url += "&" + key + "=" + (typeof param == "function" ? param() : param); }); url += "&rnd=" + Math.random(); return url; };

# by 路人甲

高手一出馬果然不一樣,立即解決我昨天研究一天都無法處理的問題。 再次謝謝你的幫忙!

# by ypfbkg

Hello Jeffrey, 我也會出現undifined的問題,我datatable是select後直接將資料放入。 例如: SqlDataAdapter da = new SqlDataAdapter(qrystring, connection); da.Fill(dt); return dt; 然後上面的list,我只抓兩個欄位 lst.Add(string.Format("{0}|{1}",r["a"], r["b"])); 也試著只抓一個欄位就好,但還是一樣會有undifined的問題 是因為不行直接使用da.fill(dt)的方式嗎?先感謝你提供的好範例。

# by ypfbkg

Hello Jeffrey, 是我自己搞笑了,因為我忘了將.aspx上的html碼刪掉...^^" 刪除不要的html已ok. 謝謝你的懶人包~讚

# by ypfbkg

Hello Jeffrey, 我碰到另一個問題。 就是我載入網頁前,就先給txtSymbol一個值。 但實際載入後txtSymbol會是空白 所以請想問的是,如何設定載入網頁時先設定一個值,同時也會查出來。例如載入時給2352,另一個textbox就是明基。 Thanks.

# by VC

to 黑暗大 感謝黑暗大的協助,讓我順利完成表格放大的問題 現在在試autocomplete遇到了一個問題 "關鍵字收尋顯示的資料有些會被下方的div給覆蓋" 想用捲軸要去點選時,視窗會消失, 請問有什麼解決方式呢? 謝謝

# by Jeffrey

to VC, 我想應可以透過指定.ac_results { z-index: 99; }之類方式克服,有可以重現問題的範例嗎?

# by 默司

http://dl.dropbox.com/u/16843197/autocomplete.js 提供我最近整理出來的AutoComplete功能函數 倒是沒有遇到中文的問題呢~ 使用方式: 傳入: selector (ex:'.autocomplete' or '#keyword'...etc. url (這隻程式吃webservice asmx) 傳回: selector 以便增加額外的option webservice 回傳一個包含 value 參數的List<Object>

# by Allen

請問Jeffrey大 依據Jeffrey提供的懶人包實作時,所選取的值不會帶回 不知可否為我解惑 感恩!!

# by Allen

請問Jeffrey大 依據懶人包實作,會無法如同範例可以將代號及名稱帶回 不知Jeffrey大可否為我解惑 感恩!!

# by Jeffrey

to Allen, 建議你先直接連線http: // yourserver/ ACDataSrc.aspx?q=23看後端是否可以順利供應資料,若OK再使用IE Dev Tools設定中斷點去追查資料是否順利接入。

# by Allen

報告Jeffrey大 不好意思 讓你誤解了 後端有把值傳出,但就在選值時無法把代號及名稱帶回textbox

# by Allen

報告Jeffrey大 我找到為何不會把值帶回textbox的原因了,原來是我之前的AutoComplete.js和Jeffrey大的內容有差異,難怪會無法使用 謝謝Jeffrey

# by Allen

Jeffrey大 不好意思 又來打擾你了 我想請教一下 如果我一開始會帶預設值 要怎麼做才不會把我的預設值清空??

# by Allen

Jeffrey大 參考了 之前"凱大"的對話記錄後,試了很久都不行 後來我把 if (v != input.lastSelected) { selectItem(null); } 改成 if (input.lastSelected != undefined) { if (v != input.lastSelected) selectItem(null); } else { input.lastSelected = v; } 這樣就可以讓預設值不清空,還會判斷輸入不符合的字也會被清掉 搞了好幾天才弄出來(汗= =|||)

# by Jeffrey

to Allen, Good Job! 謝謝分享~

# by hal

可否請教一個問題就是,我在 google的Chrome 上執行時, 用中文的話會無法打出完整的字,在Ie卻不會 有人遇到一樣的問題嗎? ===== 努力尋找解答中

# by hal

把mustMatch設成false 就可以解了 造成打擾~~~不好意思~~

# by hal

請教一下 回傳指定的textbox 這個是固定的id 如果在gridview 裏要如何指定那一列的textbox呢?

# by Jeffrey

to hal, 我想到兩種做法: 1) 修改jquery.autocomplete.js, 在510行呼叫options.onFindValue(li)時加傳INPUT元素,例如: options.onFindValue(li, $input); 2) 在輸入INPUT加掛keydown事件,將當時操作的textbox的id儲存為全域變數(或用$.data()),在findValue()時再由該變數得知目前輸入的textbox

# by hal

謝謝,這兩種做法 我都要再想辦法試看看~~ 感謝您的協助~~~

# by FBI

黑暗大你好: 小弟最近在實做autocomplete上遇到了難題 在text輸入完資料,結果也跑出來後同時間我想再另外點選radio 做篩選,可是只要focusout之後,搜尋結果視窗就會自動消失 我試過用radio click event 自動focus回text,搜尋結果視窗還是無法保留>"< 請問黑暗大,有什麼解決的好方法呢? 謝謝您

# by Jeffrey

to FBI, 如果沒有誤會意思,你指的是提示區出現時,多一個Radio操作程序篩選掉部分提示區的結果項目嗎? 這與典型自動完成的運作模式及構想有點出入(自動完成多強調一按鍵就迅速反應,並能很快選到想要的結果),因此修改工程不小,依我的想法,不如改用blockUI等技術,彈出提示結果的篩選操作介面,或許更簡便些。

# by hal

我在使用時,會發生自然輸入法or 新注音,會發生中文字打完不會查詢的問題,目前有解決的方式是用 在 jQuery.autocomplete = function(input, options) { 加上 $input.bind("input", function() { onChange(); }); 的方式解決 另有參考http://itindex.net/detail/14431-jquery-%E4%B8%AD%E6%96%87-keydown 這篇

# by

不好意思,請問..我下載回來後, 用在ASP.NET的專案裡, 可是我輸入文字,完全不會有提示, 我看它有進receiveData 但沒有進ACDataSrc.aspx 的PAGELOAD 請問有可能問題是在哪呢?謝謝!!!

# by

請問,我下載後,引用到asp.net的網站裡 但key入文字都沒提示訊息, 我看它有進receiveData 但沒有進ACDataSrc.aspx 的pageload 請問可能是什麼原因呢?

# by

不好意思,我知道原因了~ 因為我asp.net專案的名稱是中文, 這要它就失效了... 請問這個問題有解嗎??謝謝

# by

不好意思,我知道原因了~ 因為我asp.net專案的名稱是中文, 這要它就失效了... 請問這個問題有解嗎??謝謝

# by Jeffrey

to 魚,因為專案名稱是中文而失效,直覺可能跟URL Encoding有關(但不確定),autocomplete(ACDataSrc.aspx_Url) <== 這裡有用到中文專案名稱嗎?

# by

我是延用ACDataSrc.aspx ,這裡沒有改成中文 我目前還在進修 JQUERY 相關UI, 有心得再回得,謝謝^^

# by

我是延用ACDataSrc.aspx ,這裡沒有改成中文 我目前還在進修 JQUERY 相關UI, 有心得再回得,謝謝^^

# by

黑暗大你好: 感謝你的懶人包 但我在使用上遇到個問題 當search的內容是用jquery填入時 如:$("#search").val(s2); 不會出現搜尋的結果 我在網路上找到種做法 在掛autocomplete後再掛bind focus 如: $("#search").autocomplete(...).bind("focus", function () { $(this).autocomplete("search"); }); 之後用trigger的方式 如: $("#search").val(s2).trigger("focus"); 也是不會出現搜尋結果 請問黑暗大該如何解決這個問題? 謝謝

# by Jeffrey

to 蓋, 試試 $("#txtSymbol").focus().val("2303").trigger("keyup");

# by JerryH

請教一個問題.. 若KEY入的資料只找到一筆相容的資料 有法子可以直接觸發findValue嗎? 然後自動填入嗎?

# by JerryH

若KEY入的資料只找到一筆相符的資料 有法子可以直接觸發findValue嗎? 然後自動填入嗎? 已找到改一下.. function receiveData(q, data) { ... if (data.length == 1) { if (options.onFindValue) findValueCallback(q, data); } else showResults(); 就可以

# by Barry

黑暗大你好: 我發現在ie7的環境下, 無法使用滑鼠點選隨書隨選的清單 不知有什麼解法嗎?

# by Jeffrey

to Barry, 剛好今天有IE7環境可測,未發現點選清單無法帶入結果的現象,可否能再提供更進一步的問題描述? (使用本文的範例網頁測試? 手邊所有的IE7都會發生,IE8+就OK?)

# by Barry

黑暗大你好: 我使用黑暗大所提供的範例網頁在ie7上也是會發生使用滑鼠無法點選在下拉的選單中,只能使用鍵盤來上下移動,黑暗大測試不會嗎? 我套用在網站上也是有一樣的情況 使用ie7在下列網址的全文檢索輸入"地價稅"就可以看到情況 http://www.kctax.gov.tw/tw/index.aspx

# by Jeffrey

to Barry, 經使用IE7測試,我的範例OK,kctax網站確實無法使用滑鼠。檢測發現問題出在js/201112/jquery.autocomplete.css .ac_results IFRAME將Z-INDEX設成10,應調為-1,否則IFRAME在IE7下會遮蔽<UL>區,阻擋滑鼠操作。蠻有趣的茶包,如果您沒有其他他考量,我想寫篇文章分享技術細節,在此徵求您的同意。

# by Barry

黑暗大, 感謝協助,當然沒問題,等候黑暗大的大作嚕

# by Stan

黑暗大你好: 我的點選清單都正常, 但我在textbox直接壓enter 鍵, textbox的值就會直接清空,請問有可能問題是在哪呢?謝謝!!!

# by Gary

暗黑大, 你好; 感謝你提供的範例,我想請問為何只有輸入到4位 後就會被更改並清空,這部份的修改應該要改那段呢? 追了好一會,還是不得其解,所以寫訊來和您請教,感謝

# by Jeffrey

to Gary, 你是指輸入到第4位數字就自動清空,還是輸完4位後按Enter或Tab被清空?若是後者,autocomplete()要多加selectFirst: true參數。

# by fish

黑暗大您好: 謝謝您的範例,第一次寫jquery,值一直塞不進textbox裡, 請問如果值是以SQL的方式撈出 執行到jquery-1.3.2.js 裡的 jQuery = window.jQuery = window.$ = function( selector, context ) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery.fn.init( selector, context ); }, 在context的地方都是undifined 請問這是哪邊沒有設定好嗎?

# by Jeffrey

to fish, 如果你是追蹤$("#txtName").val("value")追到你說的程式段落, 由於只傳了selector參數, context是undefined是合理的. 你可以在jsbin.com重現你有問題的程式嗎? 這樣大家應該可以很快抓出你的問題.

# by vic

您好,請問此方法可以以空白見做多的條件搜尋嗎? 像是apple 如果輸入 a e 可以搜尋到 apple

# by Jeffrey

to vic, 這類自動完成模式講究按鍵後立即精準反應的回饋感,加入萬用字元做模糊比對易讓符合結果過多,選項太多要花時間挑選有損操作體驗,你說的做法比較適合輸入完按查詢顯示一排結果再挑選的操作模式。但如果真的要用這個做法修改,可將 dv.RowFilter 改成 LIKE 'a%p%'。

Post a comment