如何在ajax調用中包含js文件？

Question

我正在調用ajax方法來更新div。 它包含需要java腳本文件的鏈接和函數。 但是這些方法和函數沒有被正確調用，因為java腳本文件沒有通過ajax調用包含在內。 例如，我試圖調用燈箱功能，但它被重定向到不同的頁面而不是燈箱。

在此先感謝Anubhaw Prakash

Answer 1

原型中的Ajax框架將正確執行<script>標記的文本內容，但不會通過<script src="somefile.js"/>導入新的腳本文件。 我想出的唯一解決方案是在頁面的頭部導入我需要的所有javascript文件。 這樣，導入文件中的函數可用於Ajax響應中執行的內聯javascript代碼。

Answer 2

我有一個類似的問題，我確實想要后載一些JavaScript。 我做的是分離加載html片段並將腳本加載到兩個調用中。 為了加載腳本，我調用以下函數（我有JQuery處理ajax部分）：

function loadModule(name, callback) {
    $.ajax({type: "POST"
          , url: "/js/" + name
          , dataType: "script"
          , success: callback
    });     
}

Answer 3

我看到你正在使用Ruby on Rails - 這是否意味着你在客戶端使用Prototype？ 如果是這樣，Prototype的Ajax.Updater將忽略引用外部文件的腳本標記（它將評估內聯內容的腳本標記）。 因此，要將這些外部文件添加到頁面中，您必須通過onSuccess回調掛鈎進程，在responseText查找具有src屬性的腳本標記，並自行處理。 一旦你確定了相關的腳本標記並提取它們的src屬性，可以通過動態添加腳本，描述它們包括本文來自非官方的原型和script.aculo.us維基。

Answer 4

寫入innerHTML <script>標簽不會在寫入時執行。 您可以執行element.getElementsByTagName('script')來嘗試獲取它們並手動執行它們的腳本，但它非常難看且不可靠。

對於寫入innerHTML的<script>元素所發生的事情與瀏覽器的差異很簡單，然后（直接或通過祖先）重新插入到文檔中。 你想避免這種事情：根本不要將<script>寫入innerHTML 。

然后你也不必擔心兩次執行腳本，這是你不想對庫腳本做的事情。 您不希望最終得到一個看起來相同但不比較相等的函數/類的兩個副本，並且它們將鈎子保持在彼此不能很好地相互作用的頁面上。 動態插入的庫腳本是混淆失敗的一種方法。

更好地靜態包含腳本，並在將新元素寫入頁面后手動將它們綁定到頁面元素。 如果你真的需要，你可以讓你的AJAX調用獲取一個JSON對象，該對象包含要添加的新HTML和要執行的一串字符。

Answer 5

可能想嘗試在：before選項中運行一些預備javascript來設置具有正確文件的變量？

Answer 6

嘿，我找到了添加它的方法.... :)

注意 - 這是一個同步過程，所以你不必擔心腳本是否加載....腳本將始終加載實例你調用該函數，你可以立即開始使用加載的腳本..

讓我們使用這兩個功能

1）第一個是ajax函數，用於檢索async應為true的值，以便同步發送請求

    // AJAX FUNCTION
    function loadXMLDoc(reqt,url,reqp,cfunc,async)
    {
        var xmlhttp;
        try// code for IE7+, Firefox, Chrome, Opera, Safari
        {
            xmlhttp=new XMLHttpRequest();
        }
        catch(err)// code for IE6, IE5
        {
            try{
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch(e){
                try{
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                catch(E){}
            }
        }
        if(!xmlhttp)
        {
            alert("error");
        }
    xmlhttp.onreadystatechange=function(){
        if(xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            cfunc(xmlhttp.responseText);
        }
    }
    if(reqt=='GET')
    {
        url+=(reqp!=""?"?":"")+reqp;
        xmlhttp.open("GET",url,(async?false:true));
        xmlhttp.send();
    }
    else if(reqt=='POST')
    {
        xmlhttp.open("POST",url,(async?false:true));
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send(reqp);
    }
    else
    {
        return false;
    }
    }
    /*use this function
    loadXMLDoc(reqt,url,reqp,function(response){
    });
    */

2）然后我們使用ajax將js文件作為字符串加載，然后將其附加到新腳本標簽的innerHTML然后將其附加到head部分，還有一件事要確保文件已經加載我使用了腳本標記的id作為文件的路徑，這使得檢查重復的任務真的很容易...... :)

    //add new script dynamically
    function add_script(src)
    {
        if(!document.getElementById(src))
        {
            loadXMLDoc("GET",src,"",function(jsresp){
                var head = document.getElementsByTagName("head")[0];
                var script=document.createElement("script");
                script.type='text/javascript';
                script.id=src;
                script.text=jsresp;
                head.appendChild(script);
            },true);
        }
    }

感謝我以前獲得的所有幫助，並將從本網站及其用戶獲取用於開發目的...

關於VIPIN JAIN

Answer 7

1. 在需要使用它們的頁面上包含靜態腳本（IE包含燈箱，然后包含燈箱腳本）
2. 問題解決了。 不要使用AJAX加載腳本
3. 使用AJAX回調對靜態腳本進行必要的函數調用