在PHP脚本运行时添加加载图像

我有一个PHP脚本（粘贴在下面），它从URL列表中提取元数据，问题是可能需要一段时间才能加载，并且用户永远不知道它何时完成（除非他们留意他们的浏览器标签中的加载图标）在PHP脚本运行时添加加载图像

我一直在网上寻找很长一段时间，但找不到解决方案，我读过我可以使用Ajax，但我怎么能在这个脚本上使用它？

感谢您的帮助！

<script type="text/javascript"> 
function showContent(vThis) 
{ 
    // http://www.javascriptjunkie.com 
    // alert(vSibling.className + " " + vDef_Key); 
    vParent = vThis.parentNode; 
    vSibling = vParent.nextSibling; 
    while (vSibling.nodeType==3) { // Fix for Mozilla/FireFox Empty Space becomes a TextNode or   Something 
     vSibling = vSibling.nextSibling; 
    }; 
    if(vSibling.style.display == "none") 
    { 
     vThis.src="collapse.gif"; 
     vThis.alt = "Hide Div"; 
     vSibling.style.display = "block"; 
    } else { 
     vSibling.style.display = "none"; 
     vThis.src="expand.gif"; 
     vThis.alt = "Show Div"; 
    } 
    return; 
} 

</script> 



<form method="POST" action=<?php echo "'".$_SERVER['PHP_SELF']."'";?> > 
<textarea name="siteurl" rows="10" cols="50"> 
<?php //Check if the form has already been submitted and if this is the case, display the submitted content. If not, display 'http://'. 
echo (isset($_POST['siteurl']))?htmlspecialchars($_POST['siteurl']):"http://";?> 
</textarea><br> 
<input type="submit" value="Submit"> 
</form> 
</div> 

<div id="nofloat"></div> 
<div style="margin-top:5px;"> 
<h4><img src="expand.gif" alt="Show Div" border="0" style="margin-right:6px; margin- top:3px; margin-bottom:-3px; cursor:pointer;" onclick="showContent(this);" />Show me the script working!</h4> 
<div style="margin-top:5px; display:none;"> 
<table class="metadata" id="metatable_1"> 
<?php 
ini_set('display_errors', 0); 
ini_set('default_charset', 'UTF-8'); 
error_reporting(E_ALL); 
//ini_set("display_errors", 0); 
function parseUrl($url){ 
    //Trim whitespace of the url to ensure proper checking. 
    $url = trim($url); 
    //Check if a protocol is specified at the beginning of the url. If it's not,  prepend 'http://'. 
    if (!preg_match("~^(?:f|ht)tps?://~i", $url)) { 
      $url = "http://" . $url; 
    } 
    //Check if '/' is present at the end of the url. If not, append '/'. 
    if (substr($url, -1)!=="/"){ 
      $url .= "/"; 
    } 
    //Return the processed url. 
    return $url; 
} 
//If the form was submitted 
if(isset($_POST['siteurl'])){ 
    //Put every new line as a new entry in the array 
    $urls = explode("\n",trim($_POST["siteurl"])); 
    //Iterate through urls 
    foreach ($urls as $url) { 
      //Parse the url to add 'http://' at the beginning or '/' at the end if not already there, to avoid errors with the get_meta_tags function 
      $url = parseUrl($url); 
      //Get the meta data for each url 
      $tags = get_meta_tags($url); 
      //Check to see if the description tag was present and adjust output accordingly 
      $tags = NULL; 
$tags = get_meta_tags($url); 
if($tags) 
echo "<tr><td>$url</td><td>" .$tags['description']. "</td></tr>"; 
else 
echo "<tr><td>$url</td><td>No Meta Description</td></tr>"; 
    } 
} 
?> 
</table> 
</div> 
<script type="text/javascript"> 
     var exportTable1=new ExportHTMLTable('metatable_1'); 
    </script> 
<div> 
     <input type="button" onclick="exportTable1.exportToCSV()" value="Export to CSV"/> 
     <input type="button" onclick="exportTable1.exportToXML()" value="Export to XML"/> 
    </div> 
</div>

来源

2012-04-25 RuFFCuT

你可以尝试修剪脚本到相关的位？阅读这些内容有点多。如果您不介意该网站只启用JavaScript，那么您可以使主页面显示一条加载消息，并踢出脚本，通过AJAX请求进行繁重的操作。如果你想要一个纯粹的PHP解决方案，那么可能会有大量的输出缓冲和冲洗 – GordonM 2012-04-25 09:11:46

当然！对于那个很抱歉！ – RuFFCuT 2012-04-25 09:12:41

理念：

添加PHP代码到不同的文件

显示加载图像

然后再调用这个函数

function Load() 
{ 
    var xmlhttp; 
    var url; 

    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) 
     {   
      //(optional)do something with response: xmlhttp.responseText 
      document.getElementById("area").innerHTML=xmlhttp.responseText; 
      document.getElementById("loadingimage").src = "afterloading.gif"; 
     } 
    } 

    xmlhttp.open("GET","phpfile.php",true); 
    xmlhttp.send(); 
}

此功能去你的JavaScript的地方然后呼叫它带有jquery文件完成加载后或

<body onload="Load()">

，并在身体发生类似

<img id="loadingimage" src="loading.gif"/> 
<div id="area">...</div>

来源

2012-04-25 09:20:08

嗯听起来很有趣，所以我会做的是例如拿出我的PHP把它放在另一个文件中，然后将此代码放在自己的位置？我将如何显示加载图像？（对不起，我有点小菜）。 – RuFFCuT 2012-04-25 09:23:58

根据您的要求更新了代码。 – 2012-04-25 09:32:41

非常感谢你！所以，因为我的PHP输出数据到一个HTML表格，我需要将它分成两部分？所以HTML回显部分进入我的前端页面，其余部分进入后端？ – RuFFCuT 2012-04-25 09:55:59

提取该做的工作（<?php ini_set [...] ?>），将其存储在一个单独的文件中的部分（GetMetaData.php为例），并使其返回JSON或XML。

然后，您可以捕获提交事件，并使其以异步方式发布用户输入到GetMetaData脚本的URL。当该调用返回时，可以使用脚本返回的数据填充表。

来源

2012-04-25 09:14:40 CodeCaster

正如我在我的评论中提到，有基本上这里有两个选项。第一个依赖javascript来工作，第二个依赖于输出缓冲来给出关于正在发生的事情的“正在运行的评论”，并取决于脚本中可以输出进度报告的敏感点。

AJAX方法只是简单地将代码完成繁重的工作，并将其放置在自己的可通过AJAX调用的PHP脚本中。然后主页面只是一个加载屏幕和一个调用通过AJAX完成工作的脚本的JavaScript。当AJAX脚本完成时，可以触发回调函数将返回的结果格式化为HTML，并将其显示为加载屏幕。

另一种方法涉及在脚本的主循环中使用输出缓冲和刷新。

while ($task_not_complete) 
{ 
    do_some_more_work(); 
    echo ('<p>Something indicating how much progress has been made goes here</p>'); 
    ob_flush(); 
    flush(); 
}

这种方法不需要JavaScript，但它有它自己的缺点。首先，根据Web服务器或客户端与服务器之间可能存在的代理服务器如何设置缓冲区，它可能根本无法工作，直到脚本完成后才会返回任何输出。其次，在服务器上的脚本完成并且浏览器收到关闭</html>标记之前，DOM树才会生效。这意味着，在正在执行的进程完成之前，该页面使用的任何JavaScript都无法可靠地进行DOM操作。

来源

2012-04-25 09:32:39 GordonM

在PHP脚本运行时添加加载图像

回答

相关问题