如果我們在 ScriptManager 中設定 EnablePageMethods 屬性, 而且在 Server 端某個方法上加上 WebMethod 標記, 我們就可以直接從 JavaScript 中把這個 Server 端的方法拿來當做 JavaScript 的函式一樣的使用。先看看以下的範例...
如果我們在 ScriptManager 中設定 EnablePageMethods 屬性, 而且在 Server 端某個方法上加上 WebMethod 標記, 我們就可以直接從 JavaScript 中把這個 Server 端的方法拿來當做 JavaScript 的函式一樣的使用。先看看以下的範例:
.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test Ajax Page Methods</title>
<script type="text/javascript" language="javascript">
function showMessage() {
var ctl = $get('txt');
PageMethods.convNameToColor(ctl.value, success, null);
}function success(result, context, method) {
if (method == 'convNameToColor') {
alert(result);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"/>
</div>
<asp:TextBox runat="server" ID="txt" />
<asp:Button runat="server" ID="btn" Text="Submit" OnClientClick="showMessage();" />
</form>
</body>
</html>
.aspx.cs
using System.Drawing;
...
[System.Web.Services.WebMethod]
public static string convNameToColor(string colorName)
{
Color c = Color.FromName(colorName);
if (c.IsKnownColor)
return "#" +
((c.R < 16) ? "0" : "") + Convert.ToString(c.R, 16) +
((c.G < 16) ? "0" : "") + Convert.ToString(c.G, 16) +
((c.B < 16) ? "0" : "") + Convert.ToString(c.B, 16);
else
return null;
}
這個網頁很簡單, 上面只有兩個控制項, 一個 TextBox, 一個 Button。在 TextBox 中輸入一個顏色名稱 (例如 red), 再按下 Button, 就會將顏色名稱透過 convNameToColor 方法轉換成類似 #00ff00 的十六進位 RGB 表示式。這個程式的神奇之處在於這個 convNameToColor 方法其實是在 Server 端以 ASP.NET 撰寫的, 但是你卻可以直接在 JavaScript 中當成一般的函式來呼叫並相互傳值。
透過這種方法, 我們將可建立一道從 JavaScript 通往 Server 的方便之門, 我相信你一定可以由此發展出更豐富的應用。