jquery autocomplete自動完了プラグインの使用方法
2779 ワード
まず必要なファイルをダウンロードします.autocomplete.jsとjquery.autocomplete.css.
このコントロール取得データは配列とURLの2つの方法で取得できるので,2つの簡単な例を書いて試験した.
フロントコードは次のとおりです.
このコントロール取得データは配列とURLの2つの方法で取得できるので,2つの簡単な例を書いて試験した.
フロントコードは次のとおりです.
<br/><script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"/>
<br/><script src="Scripts/jquery.autocomplete.js" type="text/javascript"/>
<br/><link href="Styles/jquery.autocomplete.css" type="text/css"/>
<br/><script language="javascript" type="text/javascript">
<br>//
<br>$(document).ready((function () {
<br>var data = [" ", " ", " ", " ", " "];
<br>$("#txtProvince").autocomplete(data);
<br>// SERVER
<br>$("#txtUser").autocomplete("GetUserName.aspx");
<br>}
<br>));
<br></script>
<br/>
<br/>
<br/><form id="form1" runat="server">
<br/><div>
<br/> ：<input id="txtProvince" type="text"/>
<br/></div>
<br/><div>
<br/> ：<input id="txtUser" type="text"/></div>
<br/></form>
<br/>
<br/>
<br/>
</code></pre>
<br/> ， URL GetUserName.aspx。 .cs ：
<br/>
<pre><code>
<br/>protected void Page_Load(object sender, EventArgs e)
<br/>{
<br/>// q
<br/>if (Request.QueryString["q"] != null)
<br/>{
<br/>string key = Request.Params["q"].ToString();
<br/>string result = "";
<br/>db db = new db();
<br/>string sql = "select UserName from Users where UserName like '" + key + "%'";
<br/>SqlDataReader dr = db.GetReader(sql);
<br/>while (dr.Read())
<br/>{
<br/>result += dr["UserName"].ToString() + "<br>";
<br/>}
<br/>if (result == "")
<br/>result = "not exists";
<br/>Response.Write(result);
<br/>}
<br/>}
<br/>
</code></pre>
<br/> ， 。 ， CSS。 。 ， rel="stylesheet"，MY GOD！ 。
<br/> 。 。
<div class="clearfix">
<span id="art_bot" class="jbTestPos"/>
</div>
</div>
</div>
</div>