在UpdatePanel中内嵌Javascript的问题以及解决方案

最近总在微软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不会出错.

你可能感兴趣的:(JavaScript)