從Javascript函數調用帶有MySQL查詢的PHP頁面，然后將結果返回給另一個JavaScript函數

Question

我正在重構一些代碼。 我有一個包含MySQL查詢的PHP頁面，並將結果存儲在PHP變量$ my_result中。 然后，在使用SWFObject進行嵌入的過程中，此結果將回顯到Flash SWF。

現在，我要調用此PHP頁面，該頁面從像這樣的javascript函數進行查詢-我對PHP所做的一項更改是，我將結果而不是存儲在變量$ my_result中。

Javascript函數調用PHP頁面並進行數據庫查詢

function getNewUploads() {
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
       xmlhttp=new XMLHttpRequest();
    }
    else {// code for IE6, IE5
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
       if (xmlhttp.readyState==4 && xmlhttp.status==200) {
    alert(xmlhttp.responseText); // shows the correct output in an alert box
    return xmlhttp.responseText;
       }
    }
 xmlhttp.open("GET","dBaseConnect_uploadStep2.php",true);
 xmlhttp.send();    
}

然后，我嵌入了Flash，我只想在頁面上單擊某個選項卡並由jabvascript處理時才會發生-

function show_tab(tab_id) {

    $(tab_id).show();
    if(tab_id == "#tab_2") {
      var data_string = getNewUploads(); // CALLING THE FUNCTION TO CALL THE PHP QUERY  
      alert(data_string); // shows undefined in the alert box
      var so = new SWFObject(".....");          
      so.addVariable("theDataString", data_string); 
      so.write("flashcontent2");
    }
}

因此，似乎getNewUploads（）函數不會從PHP頁面返回結果。

誰能告訴我我的錯誤。 謝謝

Answer 1

該調用是異步的。 呼叫send ，呼叫將在后台開始。 同時，getNewUploads返回。 稍后，您分配的函數將與答案一起調用。 當您return xmlhttp.responseText ，您將從此匿名函數（已分配給onreadystatechange）返回，而不是從getNewUploads（已完成）返回。

您可以改用回調。 就像是：

function getNewUploads(callback) {
    if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
       xmlhttp=new XMLHttpRequest();
    }
    else {// code for IE6, IE5
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
       if (xmlhttp.readyState==4 && xmlhttp.status==200) {
         callback(xmlhttp.responseText);
       }
    }
    xmlhttp.open("GET","dBaseConnect_uploadStep2.php",true);
    xmlhttp.send();    
}

function show_tab(tab_id) {
    $(tab_id).show();
    if(tab_id == "#tab_2") {
      getNewUploads(function(data_string) {
        alert(data_string);
        var so = new SWFObject(".....");          
        so.addVariable("theDataString", data_string); 
        so.write("flashcontent2");
      }); // CALLING THE FUNCTION TO CALL THE PHP QUERY  
    }
}

我們將getNewUploads定義為采用單個參數callback 。 然后，在成功函數中，我們使用單個參數（響應文本）調用回調。 在show_tab ，我們傳遞一個匿名函數，該函數將單個參數（響應文本）傳遞給getNewUploads作為callback參數。

Answer 2

在true的xmlhttp.open("GET","dBaseConnect_uploadStep2.php", true); 使其異步 ，從而導致錯誤。 更改為：

function getNewUploads() {
  //initialize xmlhttp
  xmlhttp.open("GET", "dBaseConnect_uploadStep2.php", false);
  xmlhttp.send();    
  if(xmlhttp.status == 200) 
    return xmlhttp.responseText;
  else
    return "Oops :(";
}