开发者

Trying to call JS Code that is passed back from AJAX call

开发者 https://www.devze.com 2023-01-03 00:14 出处:网络
Okay, so I have an javascript function that retrieves some HTML... function updateQuestions(i){ var url = \'getQuestions.php?sys=\' + i;

Okay, so I have an javascript function that retrieves some HTML...

function updateQuestions(i){
    var url = 'getQuestions.php?sys=' + i;
    if (receiveReq.readyState == 4 || receiveReq.readyState == 0) {
        receiveReq.open("GET", url, true);
        receiveReq.onreadystatechange = handleQuestionsUpdate; 
        receiveReq.send(null);
    }
}

function handleQuestionsUpdate() {
    if (receiveReq.readyState == 4) {
        var a=receiveReq.responseText;
        document.getElementById('questions').innerHTML=a;
        checkSpeakers(); //Error Occurs Here, even though checkSpeakers() is a function in the returned HTML chunk.
    }   
}

This HTML is not just HTML, but it is more specifically a form and a chunk of javascript. The javascript is hard-coded into the HTML and not referenced by <script src="..">

Is it normal that this retrieved JS code isn't recognized upon call-time? If so, what is my alternative if I need the JS to change every time the div is update?

This is the text being returned to the javascript function.

function checkPillow开发者_运维技巧Speakers()
{
    var pillowSpeakers = document.getElementById('Q9').value + document.getElementById('Q10').value;
    document.getElementById('PS1').style.display = ((pillowSpeakers > 0)? '' : 'none');
    document.getElementById('PS2').style.display = ((pillowSpeakers > 0)? '' : 'none');
}~ARRAYSEPERATOR~<html>....</html>

The JS Code is seperated from the HTML code by an ~ARRAYSEPERATOR~ tag. The issue is that I don't want to EXECUTE the code at this time, I just want it queued so I can call it on command.


You should first try to get the JavaScript part from the HTML content. Then you can easily execute it using eval() function from JavaScript;


My answer from How To Call Javascript In Ajax Response? IE: Close a form div upon success

// response is the data returned from the server
var response = "html\<script type=\"text/javascript\">alert(\"foo\");<\/script>html";
var reScript = /\<script.*?>(.*)<\/script>/mg;
response = response.replace(reScript, function(m,m1) {
    var fn = new Function(m1); // this will make the eval run in the global scope
    fn(); //will run alert("foo");
    return "";
});
alert(response); // will alert "htmlhtml"


After doing a whole lot of research, it seems Eval() has some memory issues... so I actually came across this solution:

//Firstly, create a div called codeHolder

var javascriptCode="function test(){.....}";
var JSONCode=document.createElement("script");
JSONCode.setAttribute("type","text/javascript");
JSONCode.text=javascriptCode;

var cell=document.getElementById("codeHolder");
if ( cell.hasChildNodes() )
    while ( cell.childNodes.length >= 1 )
        cell.removeChild( cell.firstChild );

cell.appendChild(JSONCode);


you should realy think of using an js-lib for ajax for browser-compatibilty and less memory leaks - but if you want to do this by yourself, you have to eval() the passed back javascript before you can use it.


There is also responseXML:

receiveReq.responseXML.getElementsByTagName('input')

etc., etc.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号