検索

ホームページ >ウェブフロントエンド >jsチュートリアル >jquery autocomplete自動補完プラグインの使い方_jquery

jquery autocomplete自動補完プラグインの使い方_jquery

WBOY
WBOYオリジナル
2016-05-16 18:21:481222ブラウズ

まず、必要なファイル jquery.autocomplete.js および jquery.autocomplete.css をダウンロードします。
コントロールは配列と URL からデータを取得できるため、テストするために 2 つの簡単な例を作成しました。
フロントエンド コードは次のとおりです:

コードをコピーします コードは次のとおりです:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AutoComplete.aspx.cs" Inherits="AutoComplete" %>








🎜>

県 :
id="txtUser" type="text " />

ユーザー名部分はバックグラウンドから読み取られます。 データを取得するには、対応する URL は GetUserName.aspx です。このページの .cs ファイルは次のとおりです:




コードをコピー


コードは次のとおりです:


protected void Page_Load( object sender, EventArgs e)
{ //渡されるデフォルトのキー値は q if (Request.QueryString["q"] != null) { string key = Request.Params["q"].ToString(); string result = ""; db db = new db();
string sql = "UserName からユーザー名を選択like '" key "%'";
SqlDataReader dr = db.GetReader(sql);
while (dr.Read())
{
result = dr["UserName"].ToString () "n ";
}
if (result == "")
result = "存在しない";
Response.Write(result); 🎜>

書いてみると、目的の機能は実現できましたが、スタイルに常に問題がありました。表示される結果一覧はかなり見苦しく、CSSが適用されていないようです。長い間考えましたが、何が問題なのかまだわかりませんでした。今朝、突然、rel="stylesheet" を書き忘れていた愚かな間違いに気づきました。私は自分自身を納得させました。
これで簡単な例が完成しました。学び続けてください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：js継承_javascriptスキルの実装コード次の記事：js継承_javascriptスキルの実装コード

関連記事

続きを見る