日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

AJAX Control Toolbox 中的 AutoComplete 擴(kuò)展器提供與文本框控件相同的行為，但是它要求開發(fā)人員負(fù)責(zé)制訂向用戶提供建議的所有邏輯規(guī)則。該擴(kuò)展器會(huì)創(chuàng)建一個(gè)下拉列表樣式的面板，并將其放置在文本框的右下角。您可以根據(jù)自己的喜好設(shè)置面板的樣式和動(dòng)畫效果。下面的代碼將 Autocomplete 擴(kuò)展器與一個(gè)文本框相關(guān)聯(lián)：

＜act:AutoCompleteExtender runat="server" ID="AutoComplete1"
　　TargetControlID="TextBox1"　
　　EnableCaching="true"
　　MinimumPrefixLength="1"
　　ServicePath="Suggestions.asmx"
　　ServiceMethod="GetSuggestions" /＞

該擴(kuò)展器綁定到用于提供列表填充詞匯的 Web 服務(wù)。MinimumPrefixLength 屬性指示控件何時(shí)調(diào)用該 Web 服務(wù)。已鍵入的文本將用作指定 Web 服務(wù)方法的輸入。響應(yīng)結(jié)果用于填充下拉列表。還可以啟用緩存。這樣，在多次鍵入相同的前綴時(shí)只需調(diào)用一次 Web 服務(wù)就可以了。此外，根據(jù) Web 服務(wù)檢索其數(shù)據(jù)的方式，還可以對(duì)服務(wù)器啟用緩存，減少與數(shù)據(jù)庫或其他遠(yuǎn)程數(shù)據(jù)存儲(chǔ)區(qū)之間的額外往返行程。

圖 C 列出了 AutoComplete 擴(kuò)展器支持的所有屬性。應(yīng)注意，除了此處列出的屬性，其他擴(kuò)展器還具有另外的屬性。TargetControlID 屬性用于獲取和設(shè)置擴(kuò)展控件的 ID；Enabled 屬性允許以編程方式打開和關(guān)閉擴(kuò)展器的功能，該屬性默認(rèn)情況下設(shè)置為 True。還有 BehaviorID 屬性，該屬性用于設(shè)置提供擴(kuò)展行為的客戶端 JavaScript 對(duì)象的名稱。***，還有兩個(gè)重要屬性：ClientState 和 EnableClientState。ClientState 屬性是一個(gè)字符串屬性，用于保持?jǐn)U展器的客戶端狀態(tài)。該狀態(tài)使用隱藏字段保持，字段的名稱可以通過 ClientStateFieldID 屬性進(jìn)行設(shè)置。EnableClientState 屬性是一個(gè)布爾屬性，用于控制是否啟用客戶端狀態(tài)。

FigureCAutoComplete 擴(kuò)展器屬性

#p#

構(gòu)建自動(dòng)完成 Web 服務(wù)

與 AutoComplete 擴(kuò)展器組合使用的 Web 服務(wù)是一項(xiàng) ASP.NET AJAX 腳本服務(wù)。該服務(wù)看起來幾乎與常規(guī)的 ASP.NET Web 服務(wù)沒什么兩樣，只是該服務(wù)的類必須用 ScriptService 屬性加以修飾。如果您使用的 Web 服務(wù)缺少該屬性，則對(duì)相關(guān) ASMX 端點(diǎn)的每個(gè)請(qǐng)求都會(huì)導(dǎo)致 HTTP 500 錯(cuò)誤。不會(huì)向最終用戶顯示異常界面（擴(kuò)展器總是妥善地進(jìn)行降級(jí)處理），而且也不會(huì)顯示帶有建議的彈出面板：

[ScriptService]
public class SuggestionService : WebService
{
　 ...
}

請(qǐng)注意，腳本服務(wù)不需要 WebService 屬性，但仍可使用該屬性來提供命名空間信息。

腳本服務(wù)類上使用 WebMethod 屬性標(biāo)記的任何公共方法的名稱都可以成功地分配給擴(kuò)展器上的 ServiceMethod 屬性。用于提供建議的方法必須具有以下簽名：

[WebMethod]
public string[] GetSuggestions(string prefixText, int count)

***個(gè)參數(shù)是用于生成建議的前綴文本。它與文本框的當(dāng)前內(nèi)容相同，其長度不小于 MinimumPrefixLength 屬性的值。Count 參數(shù)指示要提供的建議數(shù)。Count 參數(shù)的值來自 CompletionSetCount 屬性的值。

如果計(jì)劃利用上下文關(guān)鍵字（一個(gè)字符串屬性，用于指示要傳遞給綁定的 Web 服務(wù)的任何頁面或用戶特定的信息），則應(yīng)為要使用的任何 Web 服務(wù)方法提供重寫方法。下面是簽名：

public string[]GetSuggestions(
　　string prefixText, int count, string contextKey)
{
　 ...
}

返回值始終以字符串?dāng)?shù)組形式打包。由于使用了 ScriptService 屬性，因此服務(wù)器與客戶端之間的所有通信都將通過 JavaScript Object Notation (JSON) 字符串進(jìn)行。

可以利用 Web 服務(wù)方法上支持的任何屬性來改善服務(wù)性能。例如，WebMethod 屬性上的 CacheDuration 屬性可以強(qiáng)制服務(wù)對(duì)指定期間內(nèi)方法調(diào)用的響應(yīng)進(jìn)行緩存。同樣，如果方法的邏輯確實(shí)需要會(huì)話狀態(tài)，則您可以啟用會(huì)話狀態(tài)。

圖 4 顯示了針對(duì)客戶名稱提供建議的示例服務(wù)，客戶名稱來自 Northwind 數(shù)據(jù)庫。從性能角度來說，鍵入少量字符就調(diào)用 Web 服務(wù)可能聽起來并不是一個(gè)好主意。但是，有一些因素使得自動(dòng)完成比您想像的要更實(shí)用。AutoComplete 擴(kuò)展器的客戶端緩存基于本地內(nèi)存，永遠(yuǎn)不會(huì)通過隱藏字段保持。通過使用指定前綴作為關(guān)鍵字，可以將與該前綴關(guān)聯(lián)的完成列表存儲(chǔ)到內(nèi)部數(shù)組中。只要在文本框緩沖區(qū)中分解出相同的前綴，都會(huì)檢索該列表。因此，如果用戶重復(fù)鍵入相同的前綴，則不會(huì)通過網(wǎng)絡(luò)對(duì)后端服務(wù)執(zhí)行任何新的請(qǐng)求。

Figure4建議服務(wù)示例

using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Data;
using System.Data.SqlClient;
using System.Web.Script.Services;
[WebService(Namespace = "MsdnMag.Articles")]
[ScriptService]
public class SuggestionService : System.Web.Services.WebService
{
　　[WebMethod]
　　public string[] GetSuggestions(string prefixText, int count)
　　{
　　　　DataView data = GetData();
　　　　data = FilterData(data, prefixText);
　　　　int totalCount = data.Count;
　　　　if (data.Count > count)
　　　　　　totalCount = count;
　　　　string[] suggestions = new string[totalCount];
　　　　int i = 0;
　　　　foreach (DataRowView row in data)
　　　　{
　　　　　　suggestions[i++] = (string) row["companyname"];
　　　　　　if (i >= count)
　　　　　　　　break;
　　　　}
　　　　return suggestions;
　　}
　　private DataView GetData()
　　{
　　　　DataView view =
　　　　　　(DataView)HttpContext.Current.Cache["Suggestions"];
　　　　if (view == null)
　　　　{
　　　　　　SqlDataAdapter adapter = new SqlDataAdapter(
　　　　　　　　"SELECT * FROM customers", "...");
　　　　　　DataTable table = new DataTable();
　　　　　　adapter.Fill(table);
　　　　　　view = table.DefaultView;
　　　　　　HttpContext.Current.Cache["Suggestions"] = view;
　　　　}
　　　　return view;
　　}
　　private DataView FilterData(DataView view, string prefix)
　　{
　　　　view.RowFilter = String.Format("companyname LIKE '{0}%'",
　　　　　　prefix);
　　　　return view;
　　}
}

客戶端緩存明顯比服務(wù)器端緩存更有效，服務(wù)器端緩存可減少一些與數(shù)據(jù)庫之間的往返過程，但無法減少與 Web 服務(wù)器之間的往返行程。在圖 4 顯示的代碼中，服務(wù)加載數(shù)據(jù)庫中的所有客戶并在 ASP.NET 緩存中存儲(chǔ)該列表。然后，從緩存中檢索客戶列表并篩選出與前綴匹配的名稱。

如前所述，用于提供建議的 Web 服務(wù)必須是 ASP.NET AJAX 腳本服務(wù)，并通過 JSON 與客戶端進(jìn)行通信。您需要確定 SOAP 客戶端是否也可公開訪問該服務(wù)。ASP.NET AJAX 服務(wù)默認(rèn)情況下具有雙重功能：JSON 和 SOAP。通過將以下代碼添加到主機(jī)應(yīng)用程序的 web.config 文件，可以關(guān)閉 SOAP 客戶端：

＜system.web＞
?。紈ebServices＞
　?。紁rotocols＞
　　?。糲lear /＞
　?。?protocols＞
?。?webServices＞
＜/system.web＞

使用 ASP.NET 3.5，還可以通過服務(wù) (SVC) 端點(diǎn)將 AutoComplete 擴(kuò)展器綁定到 Windows? Communication Foundation (WCF) 服務(wù)。該擴(kuò)展器使用以下 JavaScript 代碼來代替調(diào)用：

Sys.Net.WebServiceProxy.invoke(
　 this.get_servicePath(),
　 this.get_serviceMethod(),
　 false,
　 params,
　 Function.createDelegate(this, this._onMethodComplete),
　 Function.createDelegate(this, this._onMethodFailed),
　 text);

對(duì)于 Microsoft AJAX 客戶端庫中的 WebServiceProxy 類，關(guān)鍵是指定端點(diǎn)在內(nèi)容類型請(qǐng)求標(biāo)題設(shè)置為“application/json; charset=utf-8”時(shí)可以成功處理請(qǐng)求。若要?jiǎng)?chuàng)建 WCF 服務(wù)來提供建議，需要與下面類似的類：

[ServiceContract(Namespace = "MsdnMag.Services")]
[AspNetCompatibilityRequirements(
　　 RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class MySuggestionService
{
　　[OperationContract]
　　public string[] GetSuggestions(string prefixText, int count)
　　{
　　　...
　　}
}

此外，還需要一個(gè) SVC 端點(diǎn)，如下所示：

＜%@ ServiceHost Language="C#"　
　　　　　　　　Service="MySuggestionService"
　　　　　　　　CodeBehind="~/App_Code/WcfSuggestions.cs" %＞

若要注冊服務(wù)，可以使用 webHttpBinding 綁定模型向 web.config 文件的 serviceModel 部分添加顯式端點(diǎn)?；蛘?，可以指定 @ServiceHost 指令的 Factory 屬性，并使該屬性指向以下類：

System.ServiceModel.Activation.WebScriptServiceHostFactory

#p#

設(shè)置 AutoComplete 擴(kuò)展器的樣式

AutoComplete 擴(kuò)展器支持相關(guān)樣式設(shè)置屬性，通過這些屬性，您可以指定要對(duì)控件的樣式部分使用的 CSS 類。特別是，可以設(shè)置整個(gè)彈出區(qū)域的樣式，包括邊框和背景色。還可以對(duì)所有項(xiàng)和所選項(xiàng)使用不同設(shè)置。沒有為可選項(xiàng)提供任何預(yù)定義樣式。默認(rèn)情況下，不會(huì)選擇完成下拉列表中的***個(gè)元素。但是，可以使用 FirstRowSelected 屬性強(qiáng)制自動(dòng)選擇***項(xiàng)。

完成列表將在經(jīng)過指定毫秒數(shù)后顯示。經(jīng)過的時(shí)間通過 CompletionInterval 屬性來控制，默認(rèn)情況下設(shè)置為一秒。經(jīng)過指定的時(shí)間后，擴(kuò)展器將調(diào)用服務(wù)以獲取建議列表。

可以使用 Animations 屬性向列表的打開過程添加動(dòng)作?？梢詫?duì)以下兩個(gè)事件定義動(dòng)畫：OnShow 和 OnHide。動(dòng)畫通過 Animation 擴(kuò)展器及其相關(guān)框架來執(zhí)行（參見圖 5 中的示例）。

Figure5使用 Animations 屬性

＜Animations＞
　?。糘nShow＞
　　　　＜Sequence＞
　　　　　?。糘pacityAction Opacity="0" /＞
　　　　　?。糎ideAction Visible="true" /＞
　　　　　　＜Parallel Duration=".4"＞
　　　　　　　?。糉adeIn /＞
　　　　　　＜/Parallel＞
　　　?。?Sequence＞
　　＜/OnShow＞
　?。糘nHide＞
　　　?。糚arallel Duration=".4"＞
　　　　　?。糉adeOut /＞
　　　?。?Parallel＞
　　＜/OnHide＞
＜/Animations＞

動(dòng)畫腳本會(huì)向完成列表添加淡入和淡出效果。OpacityAction 節(jié)點(diǎn)用于設(shè)置透明度，HideAction 節(jié)點(diǎn)用于顯示完成列表以及任何其他視覺效果。***，F(xiàn)adeIn 和 FadeOut 動(dòng)作執(zhí)行淡化效果。圖 6 顯示了一個(gè)動(dòng)態(tài)完成列表。

 
圖 6運(yùn)行中的 AutoComplete 擴(kuò)展器

對(duì)列表進(jìn)行漸進(jìn)式搜索

是否曾嘗試在長長的列表中查找某個(gè)特定項(xiàng)，例如，在包含世界上所有國家/地區(qū)的列表中查找某個(gè)國家/地區(qū)的名稱？如果您速度足夠快地鍵入一些連續(xù)字母，可能會(huì)找到所需的國家/地區(qū)，但是即使猶豫了幾毫秒，那么鍵入的下一個(gè)字母就會(huì)成為搜索項(xiàng)的***個(gè)字母。ListSearch 擴(kuò)展器解決了這一限制。請(qǐng)注意，該擴(kuò)展器僅適用于 ASP.NET Web 和 HTML 控件，不可與 SELECT 或 OPTION 等常規(guī) HTML 元素一起使用。

因此，ListSearch 擴(kuò)展器的主要優(yōu)點(diǎn)是：它允許您通過鍵入字母來搜索列表控件中的項(xiàng)，并防止搜索字符串在幾秒鐘后丟失；相反，搜索字符串在您按 Esc 或回發(fā)至服務(wù)器（包括全部或部分回發(fā)）之前將一直保留在原處。鍵入的任何其他字符都將附加到搜索字符串，用于進(jìn)一步縮小搜索范圍。以下介紹如何使用 ListSearch 擴(kuò)展器：

＜act:ListSearchExtender ID="ListSearchExtender1" runat="server"
　　 TargetControlID="DropDownList1"
　　 PromptCssClass="Prompt" /＞

該擴(kuò)展器提供了三個(gè)主要屬性：PromptText、PromptCssClass 和 PromptPosition。所有這些屬性都與提示文本有關(guān)，提示文本是顯示在目標(biāo)控件周圍的字符串，用于提供有關(guān)正在搜索的文本的可視化反饋。PromptText 的默認(rèn)值為“Type to search”。當(dāng)目標(biāo)列表控件獲得焦點(diǎn)后，此文本通常顯示在該控件的上方。PromptCssClass 屬性獲取并設(shè)置要應(yīng)用于提示消息的 CSS 類的名稱。提示文本由用戶鍵入的搜索文本來取代。Esc 和 Del 按鈕在此處起著重要作用。Esc 按鈕用于清除當(dāng)前搜索并將列表重置為默認(rèn)所選項(xiàng)。Del 按鈕用于從搜索文本中刪除上一次鍵入的字符，并在列表中更新選擇項(xiàng)。此外，Animations 屬性的作用與上文 AutoComplete 擴(kuò)展器部分中討論的作用相同。

#p#

彈出式上下文菜單

在用戶即將執(zhí)行操作時(shí)，為他們提供可以執(zhí)行哪些操作的選項(xiàng)，這一點(diǎn)非常好。幾年前，工具提示就是一項(xiàng)巨大的改進(jìn)，因?yàn)樗鼈兲峁┝擞嘘P(guān)特定控件角色的彈出式附加信息。動(dòng)態(tài) HTML 的出現(xiàn)使得 HTML 工具提示成為可能。

如今，HoverMenu 擴(kuò)展器能夠在任意 ASP.NET 服務(wù)器控件旁邊顯示彈出面板。此擴(kuò)展器最常用的一個(gè)用法是，顯示由鼠標(biāo)移動(dòng)事件而不是右鍵單擊激活的上下文菜單。

當(dāng)用戶將鼠標(biāo)移動(dòng)到控件上方時(shí)，HoverMenu 擴(kuò)展器就會(huì)激活。因此，將在控件附近顯示指定的彈出面板；實(shí)際位置可以通過編程方式進(jìn)行控制。此外，可以對(duì)控件應(yīng)用 CSS 樣式以醒目的格式標(biāo)記該控件。

圖 7 顯示的單選按鈕菜單可提供有關(guān)要在文本框中插入的文本的建議。下面是相關(guān)擴(kuò)展器的聲明：

 
圖 7運(yùn)行中的 HoverMenu 擴(kuò)展器

＜act:HoverMenuExtender ID="HoverMenu1" runat="server"
　　TargetControlID="TextBox1"
　　PopupControlID="Panel1" /＞

Panel1 控件包含單選按鈕列表。為了確保所有選擇都在文本框目標(biāo)控件中進(jìn)行處理，您在單選按鈕列表中定義了一個(gè) SelectedIndexChanged 事件，并將所有相關(guān)操作都封裝在 UpdatePanel 控件中。（有關(guān)詳細(xì)信息，請(qǐng)參閱本專欄的下載內(nèi)容中所附的源代碼）。

除了 PopupControlID 和 TargetControlID 屬性之外，HoverMenu 擴(kuò)展器還提供了一些其他屬性。HoverCssClass 屬性指示要在懸停菜單可見時(shí)應(yīng)用于目標(biāo)控件的 CSS 類。PopupPosition 屬性指示相對(duì)于目標(biāo)控件的彈出位置，可能的值包括 Top、Right、Left 和 Bottom。OffsetX 和 OffsetY 屬性用于設(shè)置相對(duì)于確定位置的水平和垂直偏移量。***，PopDelay 屬性指示 DOM 事件與顯示彈出菜單之間的延遲。默認(rèn)值為 100 毫秒。

將鼠標(biāo)懸停在 DOM 事件上方時(shí)，該事件會(huì)觸發(fā) HoverMenu 擴(kuò)展器。HoverMenu 擴(kuò)展器與 Popup 擴(kuò)展器之間并沒有太大差異。主要區(qū)別在于激活機(jī)制和觸發(fā)器。當(dāng)用戶將焦點(diǎn)指向特定的目標(biāo)控件時(shí)，將會(huì)激活 Popup 擴(kuò)展器。若要激活 HoverMenu 擴(kuò)展器，用戶只需將鼠標(biāo)移動(dòng)到相應(yīng)控件上方即可。

結(jié)束語

如果希望網(wǎng)站內(nèi)容更為豐富并具有更強(qiáng)的交互性，則就需要使用更多的 JavaScript。雖然手工編寫 JavaScript 在實(shí)現(xiàn)簡單功能方面尚能夠勝任，但是，如果要實(shí)現(xiàn)更高層次的交互性，僅靠手工編寫代碼是遠(yuǎn)遠(yuǎn)不夠的。