最近總在微軟AJAX論壇上遇到關於在UpdatePanel中內嵌Javascript的問題.
問題出現的原因是AJAX只是用從伺服器端返回的資料替代代表某個UpdatePanel的DIV的InnerHTML.而這些內容並沒有被Javascript解譯器解釋執行.其中所有的Javascript都不可使用.
而用ScriptManager註冊的Javascript被放在一個單獨的地方返回,並且AJAX會顯式地載入它們.
那麼我們可不可以直接在客戶段手動地載入內嵌的Javascript呢?畢竟使用內嵌的Javascript是很多Web開發人員的習慣.
當然可以!
我們需要動態地建立Script元素,然後把我們的代碼放在裡面,這樣就可以了.
我這裡直接用我今天寫的ScriptLoader.代碼執行個體如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script src="ScriptLoader.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<script type="text/javascript">
function EndRequestHandler(sender, args)
{
window.ScriptLoader.loadScript("testScript","JScript.js",null);
}
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server">
<input id="Button2" type="button" value="button" onclick="return test()" />
</asp:Panel>
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
function test()
{
alert("Hello!");
}
沒點擊Button1前點擊Buton2會出錯,點擊Button1後再點擊Buton2不會出錯.