熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> .NET編程 >> 正文

Asp.Net+Jquery.Ajax詳解5-$.getScript

2013-11-13 10:24:11  來源: .NET編程 
    jQuerygetScript(url [callback])
   
    通過 HTTP GET 請求載入並執行一個 JavaScript 文件
   
    url:待載入 JS 文件地址
   
    callback:成功載入後回調函數
   
    此函數的jQuery內部實現 仍然使用get函數 getScript將傳入值為script的type參數 最後在Ajax函數中對type為script的請求做了如下處理
   
    [javascript]
   
    var head = documentgetElementsByTagName(head)[];
   
    var script = documentcreateElement(script
   
    scriptsrc = surl;
   
    var head = documentgetElementsByTagName(head)[];
   
    var script = documentcreateElement(script
   
    scriptsrc = surl;
   
    通過以上js代碼建立了一個script語句塊 並加入到head中
   
    headappendChild(script)
   
    當腳本加載完畢後 再從head中刪除刪除的js代碼就省略了有興趣自己去研究Jquery
   
    我僅僅做了一個非跨域的測試以後有時間再補一個跨域的
   
    實例
   
    客戶端
   
    [javascript]
   
    <%@ Page Language=C# AutoEventWireup=true CodeBehind=JqueryAjaxGetScriptaspxcs Inherits=JqueryAjaxTestJqueryAjaxGetScript %>
   
    <!DOCTYPE html PUBLIC //WC//DTD XHTML Transitional//EN transitionaldtd>
   
    <html xmlns=>
   
    <head runat=server>
   
    <title>jquery ajax test</title>
   
    <script src=Scripts/jqueryminjs type=text/javascript></script>
   
    <script type=text/javascript>
   
    $(function () {
   


    //為按鈕綁定事件
   
    $(#TestGetScriptbind(click GetScriptTest)
   
    $(#Buttonbind(click GetScriptTest)
   
    })
   
    //測試getScript
   
    function GetScriptTest(event) {
   
    $getScript(Scripts/testjs function (responseText textStatus) {
   
    $(#resulthtml(請求的js文件的內容為 + responseText + <br/> + 請求狀態 + textStatus + <br/> + 請求js的url: + thisurl)
   
    })
   
    }
   
    </script>
   
    </head>
   
    <body>
   
    <form id=form runat=server>
   
    <div>
   
    <input id=TestGetScript type=button value=測試jquerygetScript />
   
    <div id=result>
   
    </div>
   
    </div>
   
    </form>
   
    </body>
   
    </html>
   
    <%@ Page Language=C# AutoEventWireup=true CodeBehind=JqueryAjaxGetScriptaspxcs Inherits=JqueryAjaxTestJqueryAjaxGetScript %>
   
    <!DOCTYPE html PUBLIC //WC//DTD XHTML Transitional//EN transitionaldtd>
   
    <html xmlns=>
   
    <head runat=server>
   
    <title>jquery ajax test</title>
   
    <script src=Scripts/jqueryminjs type=text/javascript></script>
   
    <script type=text/javascript>
   
    $(function () {
   
    //為按鈕綁定事件
   
    $(#TestGetScriptbind(click GetScriptTest)
   
    $(#Buttonbind(click GetScriptTest)
   
    })
   
    //測試getScript
   
    function GetScriptTest(event) {
   
    $getScript(Scripts/testjs function (responseText textStatus) {
   
    $(#resulthtml(請求的js文件的內容為 + responseText + <br/> + 請求狀態 + textStatus + <br/> + 請求js的url: + thisurl)
   
    })
   
    }
   
    </script>
   
    </head>
   
    <body>
   
    <form id=form runat=server>
   
    <div>
   
    <input id=TestGetScript type=button value=測試jquerygetScript />
   
    <div id=result>
   
    </div>
   
    </div>
   
    </form>
   
    </body>
   
    </html>
   
    客戶端請求的testjs中的javascript代碼如下
   
    [javascript]
   
    alert(getScript請求的javascript文件testjs 已載入!
   
    alert(getScript請求的javascript文件testjs 已載入!
   
    測試代碼很簡單獲得的效果一目了然不再贅述了


From:http://tw.wingwit.com/Article/program/net/201311/13511.html
    推薦文章
    Copyright © 2005-2013 電腦知識網 Computer Knowledge   All rights reserved.