PHP 脚本写入 XML 文件后如何调用 Javascript 函数

发布于 2024-12-08 13:25:34 字数 3359 浏览 1 评论 0原文

我有一个 PHP 文件，其中包含一条从 MySQL 数据库提取数据的 SELECT 语句。然后它处理数据并将结果写入 XML 文件。

我有一个使用 XML 文件的 javascript 文件。在 PHP 文件下载数据并写入 XML 文件后，如何调用 JavaScript 函数，例如 doStuff()？我可以在 setTimeout() 之后调用它，但我希望有更好的方法。

每次 PHP 脚本运行时，XML 文件都会被覆盖。因此，XML 文件可能已经存在。

是否有一些事件之后我可以让 doStuff() 触发？或者有什么方法可以判断PHP脚本是否已经完成？

有什么建议吗？

谢谢。

更新：

这是我所掌握的更多详细信息。

我有一张带有表格的地图。当用户提交表单时，我使用 Ajax 来处理表单。调用 PHP 函数并选择 MySQL 数据库中的数据。数据包括纬度和经度。然后 PHP 文件使用该数据写入 XML 文件。然后，javascript 文件读取 XML 文件并在地图上放置标记。

PHP 和 javascript 工作正常。问题在于，一旦地图加载，JavaScript 文件就会立即触发。因此，xml 文件中的数据（来自先前的表单选择）将转换为标记。如果我删除 xml 文件，则地图上不会放置任何标记。 JavaScript 在加载后立即尝试使用不存在的 xml 文件。它不在那里，因此地图上没有放置任何标记。这是在用户在表单中进行任何选择之前。

我需要某种方法让加载 XML 文件的 javascript 函数仅在 XML 文件写入后才执行此操作。

我正在关注这个教程。我必须对其进行调整才能使其在 WordPress 插件中工作。

在我的 PHP 中，我得到了：

//Creates XML
//each marker has a lat and long
$my_xml ='<?xml version="1.0" ?>';
$my_xml .= '<markers>';

foreach($csf_data as $incident) {
    $my_xml .='<marker lat="'. $incident->latitude.'" lng="'.$incident->longitude.'" type="resto" />'; 
}

$my_xml .= '</markers>';

//Creates the XML file 
//(I've hardcoded markers.xml's path for now-- will change later)
$file_handle = fopen('/Users/myname/Sites/mysite/wp-content/plugins/myplugin/markers.xml', 'w');
fwrite($file_handle, $my_xml);
fclose($file_handle);

在 javascript 中，我得到了：

function downloadUrl(url,callback) {

 var request = window.ActiveXObject ?
     new ActiveXObject('Microsoft.XMLHTTP') :
     new XMLHttpRequest;

 request.onreadystatechange = function() {

   if (request.readyState == 4) {
     request.onreadystatechange = doNothing;
     callback(request, request.status);
   }
 };

 request.open('GET', url, true);
 request.send(null);

}


var customIcons = {
  resto: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png',
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
  },
  bar: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png',
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
  }
};


downloadUrl("http://mysite/wp-content/plugins/myplugin/markers.xml", function(data) {
 var xml = data.responseXML;

  var markers = xml.documentElement.getElementsByTagName("marker");

  for (var i = 0; i < markers.length; i++) {
    var type = markers[i].getAttribute("type");
    var point = new google.maps.LatLng(
        parseFloat(markers[i].getAttribute("lat")),
        parseFloat(markers[i].getAttribute("lng")));
   
    var icon = customIcons[type];
    var marker = new google.maps.Marker({
      map: map,
      position: point,
      icon: icon.icon,
      shadow: icon.shadow
    });

 
  }});



function doNothing() {}

此代码可以工作，但我需要这些 javascript 函数仅在 PHP 写入新的 XML 文件后运行。在写入新的 XML 文件后，如何调用此 javascript？

谢谢。

原文

I've got a PHP file with a SELECT statement in it that pulls data from a MySQL database. It then processes the data and writes the results to an XML file.

I've got a javascript file that uses the XML file. How do I call a javascript function, for example, doStuff(), after the PHP file has downloaded the data and written the XML file? I could call it after a setTimeout(), but I hope that there is a better way.

The XML file gets over-written each time the PHP script runs. So, the XML file may already exist.

Is there some event that I could have doStuff() fire after? Or a way of determining whether the PHP script has finished?

Any suggestions?

Thank you.

UPDATE:

Here's some more details on what I've got.

I've got a map with a form. When the users submits the form, I use Ajax to process the form. A PHP function is called and data from a MySQL database is selected. The data includes latitude and longitudes. The PHP file then writes an XML file with this data. The javascript file then reads the XML file and places markers on the map.

The PHP and the javascript work fine. The problem is that the javascript file fires immediately, as soon as the map loads. So, the data in the xml file (from a previous form selection) gets turned into markers. If I delete the xml file, then no markers are put on the map. The javascript tried to use the non-existent xml file as soon as it loads. It's not there, so no markers are placed on the map. And this is before the user has made any selections in the form.

I need some way to have the javascript function that loads the XML file do so only after the XML file has been written.

I'm follwing this tutorial . I've had to adapt it in order for it to work in a WordPress plugin.

In my PHP, I've got:

//Creates XML
//each marker has a lat and long
$my_xml ='<?xml version="1.0" ?>';
$my_xml .= '<markers>';

foreach($csf_data as $incident) {
    $my_xml .='<marker lat="'. $incident->latitude.'" lng="'.$incident->longitude.'" type="resto" />'; 
}

$my_xml .= '</markers>';

//Creates the XML file 
//(I've hardcoded markers.xml's path for now-- will change later)
$file_handle = fopen('/Users/myname/Sites/mysite/wp-content/plugins/myplugin/markers.xml', 'w');
fwrite($file_handle, $my_xml);
fclose($file_handle);

In the javascript, I've got:

function downloadUrl(url,callback) {

 var request = window.ActiveXObject ?
     new ActiveXObject('Microsoft.XMLHTTP') :
     new XMLHttpRequest;

 request.onreadystatechange = function() {

   if (request.readyState == 4) {
     request.onreadystatechange = doNothing;
     callback(request, request.status);
   }
 };

 request.open('GET', url, true);
 request.send(null);

}


var customIcons = {
  resto: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png',
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
  },
  bar: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png',
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
  }
};


downloadUrl("http://mysite/wp-content/plugins/myplugin/markers.xml", function(data) {
 var xml = data.responseXML;

  var markers = xml.documentElement.getElementsByTagName("marker");

  for (var i = 0; i < markers.length; i++) {
    var type = markers[i].getAttribute("type");
    var point = new google.maps.LatLng(
        parseFloat(markers[i].getAttribute("lat")),
        parseFloat(markers[i].getAttribute("lng")));
   
    var icon = customIcons[type];
    var marker = new google.maps.Marker({
      map: map,
      position: point,
      icon: icon.icon,
      shadow: icon.shadow
    });

 
  }});



function doNothing() {}

This code works, but I need these javascript functions to run only after PHP has written a new XML file. How can I call this javascript after the new XML file has been written?

Thank you.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

木緿 2024-12-15 13:25:34

您可以很容易地做到这一点，（并非所有必需的事情，例如在无法创建文件时采取行动等都得到照顾，但主要功能都在这里），就像这两个文件一样：

<html>
<head>
<script type="text/javascript">

var sq="'"; 
var dbq="\"";
var request = false;
try { 
  request = new XMLHttpRequest(); 
} catch (trymicrosoft) {                         
  try { 
    request = new ActiveXObject("Msxml2.XMLHTTP"); 
  } catch (othermicrosoft) {
    try {
      request = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (failed) {                  
      request = false;       
    }
  }
}


if (!request) 
  alert("Error initializing XMLHttpRequest!"); 
</script>

<script type="text/javascript">

   function makeFile( ) 
   {    
        var url = "createXml.php";  
        var params = "makeFile=1&limit="+document.getElementById('select').value+"";
        request.open("POST", url, true);  

        //Some http headers must be set along with any POST request.
        request.setRequestHeader("Content-type", "application/x-www-form-urlencoded;charset=utf-8");
        request.setRequestHeader("Content-length", params.length);
        request.setRequestHeader("Connection", "close");

        request.onreadystatechange = updatePage;
        request.send(params);

   }////////////////////

      //You're looking for a status code of 200 which simply means okay.
   function updatePage() {
     if (request.readyState == 4) {
       if (request.status == 200) 
       {    
            //run the js created by php
            eval(request.responseText);  
            //get tha needed info
            document.getElementById('divResults').innerHTML=response[0]+
            '<input type='+dbq+'submit'+dbq+' value='+dbq+'Get it..'+dbq+
            ' onclick='+dbq+'getXmlFile('+sq+response[1]+sq+')'+dbq+'; >' ; 
       } 
       else{
         //alert("status is " + request.status);
         }
     }
   }//////////////////////////////////////////////////////////////////


   function getXmlFile(fileName) 
   {  
        var url = fileName; 
        var params = null; 
        request.open("POST", url, true);     
        request.setRequestHeader("Connection", "close");    
        request.onreadystatechange = displayFile;
        request.send(params); 
   }////////////////////



      function displayFile() {
     if (request.readyState == 4) {
       if (request.status == 200) 
       {    
            document.getElementById('textareaResults').innerHTML=request.responseText;
            document.getElementById('divResults').innerHTML=
            'File loaded in text area below. '+
            '<font size=1>You could also load these data directly to a js variable using php '+
            'without creating a file...</font>' ;


       } 
       else{
         //alert("status is " + request.status);
         }
     }
   }

</script>
</head>
<body >


How many records from Mysql to put into XML file? <br>
<font size=2>(This is just for testing...)</font> <br> <br>
<select id="select">
  <option value="10">10</option>
  <option value="20">20</option>
  <option value="30">30</option>
  <option value="40">40</option>
</select> <span style="background-color:red;color:yellow;border: 5px solid gray;"  
onClick="makeFile( )"/> Click To Go.. </span>

<br> <br>
<div    id="divResults">Thank you!</div>


<textarea rows="10" cols="88"  id="textareaResults">
</textarea>



</pre>
</body>
</html>

另一个

<?PHP 
/**
Mysql
*/
mysql_connect('localhost', 'root',''); 
mysql_select_db("mysql"); 
$query="select * from help_category limit ".$_POST['limit'].";";  
$resultID = mysql_query($query ) or die("Data not found."); 

$xml_output = "<?xml version=\"1.0\"?>\n"; 
$xml_output .= "<records>\n"; 

for($x = 0 ; $x < mysql_num_rows($resultID) ; $x++){ 
    $row = mysql_fetch_assoc($resultID); 
    $xml_output .= "\t<record>\n"; 
    $xml_output .= "\t\t<help_category_id>" . $row['help_category_id'] . "</help_category_id>\n";  
    $xml_output .= "\t\t<name>" . $row['name'] . "</name>\n";  
    $xml_output .= "\t\t<parent_category_id>" . $row['parent_category_id'] . "</parent_category_id>\n"; 
    $xml_output .= "\t</record>\n"; 
} 

$xml_output .= "</records>"; 

/**If an xml file wanted or not
*/
if($_POST['makeFile']==1)
{
    $dbq="\"";
    //same queries will make the same file name
    $fileName=md5($query).'.xml';
    //check if the file exists
    if(!file_exists($fileName))
    {
        //create a new file for writing
        $fp = fopen($fileName, 'w');
        fwrite($fp,  $xml_output); 
        fclose($fp);
        echo "var response = new Array( ); response[0]=".$dbq.'A new file created..'.$dbq.";  
        response[1]=".$dbq.$fileName.$dbq.";   ";
    }
    else
    {   
        echo "var response = new Array( ); response[0]=".$dbq.'File exists and waiting..'.$dbq.";  
        response[1]=".$dbq.$fileName.$dbq.";   ";
    }
}
/**If results are required directly to the page send them
*/
else
    echo 
        $xml_output;

?>

注意
该脚本的目的是快速展示如何完成这个人要求的这些事情。在我看来，对这个答案（就像以前发生的那样 - 不仅对我而言）投反对票，对于 sql 注入死亡函数等来说完全没有生产力（安全性不是问题所要求的！），提问者必须能够区分代码是什么回答他的问题以及什么可以帮助回答者准备好运行和测试。例如，带有 die 的简单 mysql 将使立即运行 answear 变得容易。对此感到抱歉，但不幸的是，有时我们必须澄清一些非常基本的基础知识！

You can do it easilly, (not all required things like taking action if file cannot be created etc.. are taken care but main functionality is here) like this with these 2 files:

<html>
<head>
<script type="text/javascript">

var sq="'"; 
var dbq="\"";
var request = false;
try { 
  request = new XMLHttpRequest(); 
} catch (trymicrosoft) {                         
  try { 
    request = new ActiveXObject("Msxml2.XMLHTTP"); 
  } catch (othermicrosoft) {
    try {
      request = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (failed) {                  
      request = false;       
    }
  }
}


if (!request) 
  alert("Error initializing XMLHttpRequest!"); 
</script>

<script type="text/javascript">

   function makeFile( ) 
   {    
        var url = "createXml.php";  
        var params = "makeFile=1&limit="+document.getElementById('select').value+"";
        request.open("POST", url, true);  

        //Some http headers must be set along with any POST request.
        request.setRequestHeader("Content-type", "application/x-www-form-urlencoded;charset=utf-8");
        request.setRequestHeader("Content-length", params.length);
        request.setRequestHeader("Connection", "close");

        request.onreadystatechange = updatePage;
        request.send(params);

   }////////////////////

      //You're looking for a status code of 200 which simply means okay.
   function updatePage() {
     if (request.readyState == 4) {
       if (request.status == 200) 
       {    
            //run the js created by php
            eval(request.responseText);  
            //get tha needed info
            document.getElementById('divResults').innerHTML=response[0]+
            '<input type='+dbq+'submit'+dbq+' value='+dbq+'Get it..'+dbq+
            ' onclick='+dbq+'getXmlFile('+sq+response[1]+sq+')'+dbq+'; >' ; 
       } 
       else{
         //alert("status is " + request.status);
         }
     }
   }//////////////////////////////////////////////////////////////////


   function getXmlFile(fileName) 
   {  
        var url = fileName; 
        var params = null; 
        request.open("POST", url, true);     
        request.setRequestHeader("Connection", "close");    
        request.onreadystatechange = displayFile;
        request.send(params); 
   }////////////////////



      function displayFile() {
     if (request.readyState == 4) {
       if (request.status == 200) 
       {    
            document.getElementById('textareaResults').innerHTML=request.responseText;
            document.getElementById('divResults').innerHTML=
            'File loaded in text area below. '+
            '<font size=1>You could also load these data directly to a js variable using php '+
            'without creating a file...</font>' ;


       } 
       else{
         //alert("status is " + request.status);
         }
     }
   }

</script>
</head>
<body >


How many records from Mysql to put into XML file? <br>
<font size=2>(This is just for testing...)</font> <br> <br>
<select id="select">
  <option value="10">10</option>
  <option value="20">20</option>
  <option value="30">30</option>
  <option value="40">40</option>
</select> <span style="background-color:red;color:yellow;border: 5px solid gray;"  
onClick="makeFile( )"/> Click To Go.. </span>

<br> <br>
<div    id="divResults">Thank you!</div>


<textarea rows="10" cols="88"  id="textareaResults">
</textarea>



</pre>
</body>
</html>

and the other one

<?PHP 
/**
Mysql
*/
mysql_connect('localhost', 'root',''); 
mysql_select_db("mysql"); 
$query="select * from help_category limit ".$_POST['limit'].";";  
$resultID = mysql_query($query ) or die("Data not found."); 

$xml_output = "<?xml version=\"1.0\"?>\n"; 
$xml_output .= "<records>\n"; 

for($x = 0 ; $x < mysql_num_rows($resultID) ; $x++){ 
    $row = mysql_fetch_assoc($resultID); 
    $xml_output .= "\t<record>\n"; 
    $xml_output .= "\t\t<help_category_id>" . $row['help_category_id'] . "</help_category_id>\n";  
    $xml_output .= "\t\t<name>" . $row['name'] . "</name>\n";  
    $xml_output .= "\t\t<parent_category_id>" . $row['parent_category_id'] . "</parent_category_id>\n"; 
    $xml_output .= "\t</record>\n"; 
} 

$xml_output .= "</records>"; 

/**If an xml file wanted or not
*/
if($_POST['makeFile']==1)
{
    $dbq="\"";
    //same queries will make the same file name
    $fileName=md5($query).'.xml';
    //check if the file exists
    if(!file_exists($fileName))
    {
        //create a new file for writing
        $fp = fopen($fileName, 'w');
        fwrite($fp,  $xml_output); 
        fclose($fp);
        echo "var response = new Array( ); response[0]=".$dbq.'A new file created..'.$dbq.";  
        response[1]=".$dbq.$fileName.$dbq.";   ";
    }
    else
    {   
        echo "var response = new Array( ); response[0]=".$dbq.'File exists and waiting..'.$dbq.";  
        response[1]=".$dbq.$fileName.$dbq.";   ";
    }
}
/**If results are required directly to the page send them
*/
else
    echo 
        $xml_output;

?>

NOTICE
The aim of this script is to show in a fast way how can be done these things this guy asks. Down voting this answear (as has happened before -and not only to me-) for sql injections die function etc is in my opinion totally unproductive (security is not what the question asks!), the asker must be able to separate what code is for answearing his question and what is to help the answear get ready to run and test. For example the simple mysql with dies will make it easy to run the answear immediately. Sorry for this but unfortunately we have to make clear some very basic foundamentals some times!

回复收藏 0 原文

甩你一脸翔 2024-12-15 13:25:34

好的，我在 fclose($file_handle); 之后立即使用 echo 调用 PHP 中的 javascript 函数。。这样，只有在写入新的 XML 文件后才会调用 javascript 函数。谢谢。

回复收藏 0 原文

天涯离梦残月幽梦 2024-12-15 13:25:34

我想你看到的是图片的一小部分。在 fclose 之后回显 js 函数并相信这是使事情发生的事实有点不完整和误导（下面会说什么是大图）。

首先，根本没有理由从您调用的 php 中回显 js，您不希望您的代码像这样传播，根本不！我也在 fclose 之后回显一些 js，但它与以数组而不是文本形式发送数据严格相关，仅此而已。没有逻辑，没有条件，毕竟没有真正的代码！

大图主要出现在这样的行中：

request.onreadystatechange = updatePage;

这行代码表示，只要我们调用的 php 脚本准备就绪，就调用 updatePage() 函数。

我的观点是，你应该将 php 脚本留在客户端执行流程之外，不要将 js 放在那里，所有函数、逻辑、条件和客户端工作流程都应该放在客户端代码中。

实际上，您想要在 php 之后执行的函数将其放入客户端代码中的特定位置，以确保您的函数在 php 准备好后执行，该位置在这里：

   function updatePage() {
     if (request.readyState == 4) {
       if (request.status == 200) 
       {//place me here

或在此类的任何其他函数内请求准备好后调用。

如果没有这个功能，可以将 php 结果（只要准备好）返回给客户端，那么无论您在 fclose 之后或其他任何地方回显 js 函数，您都没有机会看到任何内容。这就是为什么我说你看小图片。

这就是全部，还有什么..你可以让php通知你文件是否创建成功，你可以将xml直接获取到页面而无需创建文件等等...希望你现在可以完成你的工作（研究这个例子.. .你会受益匪浅）。

I think you are seeing a small piece of the picture. Echoing the js function after fclose and beliving this is the very fact that makes things happen is a bit incomplete and misleading (will say below what is the big pics).

First of all there is no reason at all to echo js from a php you call, you don't want your code being spread like this, not at all! I too do echo some js after fclose but it is strictly related to sending data as an array instead of text, only this, nothing more. No logic, no conditions, no real real code after all!

The big pics is mainly seen in lines of this kind:

request.onreadystatechange = updatePage;

This line says that whenever the php script we called is ready then call the updatePage() function.

My point is that you should leave the php script out of your client side execution flow, don't put js there, all your functions, logic, conditions and the client side work flow should go in the client side code.

Practiaclly the function that you want to take on after php put it in your client side code in that specific place that will make sure your function is executed after php is ready, that place is here:

   function updatePage() {
     if (request.readyState == 4) {
       if (request.status == 200) 
       {//place me here

or inside any other function of this kind that is called after the request is ready.

Without this functionality that makes possible to get php result (whenever ready) back to client it doesn't matter if you echo the js function after fclose or anywhere else, you would have no chance to see anything at all. That's why I say you see the small pic.

That's it all, what else.. you can let php inform you if file created successfully or not, you can get the xml directly to page without creating a file etc... hope you can do your job now (study the example... you will benefit a lot).

回复收藏 0 原文

~没有更多了~