2

这就是这种情况。我正在构建一个页面来托管托管在 Icecast 服务器上的广播流。我让播放器工作得很好,并拼凑了一个 PHP 脚本来从服务器中提取和解析各种数据点。当前曲目、听众人数等信息。

这就是问题所在。首次打开页面时它加载正常,但我无法找到一种方法让这些变量每 5-10 秒左右更新一次,并在不完全重新加载页面的情况下使用新信息更新页面(这是毕竟广播电台,每 10 秒重新缓冲一次电台是不可行的。

在从代码中删除了各种尝试之后,这就是我到目前为止所拥有的。有任何想法吗?我已经看到它针对一两个变量完成了,但我在这里几乎有十几个......

            <div id="current_song"></div>

            <script language="javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
            <script language="javascript"> 
            {
              $.ajax({
                type: 'POST',
                url: 'script.php',
                data: 'getLatestInfo',
                dataType: 'json',
                cache: false,
              success : function(dp){
                $.getJSON('script.php', function(dp) {
            //'data' will be the json that is returned from the php file
                $.("#current_song").html("dp[9]");
            });
               getlatest();
              };
              });
            }
            </script> 

这是PHP解析器

<?php 
Function getLatestInfo() {

$SERVER = 'http://chillstep.info:1984'; 
$STATS_FILE = '/status.xsl?mount=/test.mp3'; 
$LASTFM_API= '27c480add2ca34385099693a96586bd2'; 

//create a new curl resource 
$ch = curl_init(); 

//set url 
curl_setopt($ch,CURLOPT_URL,$SERVER.$STATS_FILE); 

//return as a string 
curl_setopt($ch,CURLOPT_RETURNTRANSFER,1); 

//$output = our stauts.xsl file 
$output = curl_exec($ch); 

//close curl resource to free up system resources 
curl_close($ch); 

//loop through $ouput and sort into our different arrays 
$dp = array(); 

$search_for = "<td\s[^>]*class=\"streamdata\">(.*)<\/td>"; 
$search_td = array('<td class="streamdata">','</td>'); 

if(preg_match_all("/$search_for/siU",$output,$matches)) { 
   foreach($matches[0] as $match) { 
      $to_push = str_replace($search_td,'',$match); 
      $to_push = trim($to_push); 
      array_push($dp,$to_push); 
   } 
} 
$x = explode(" - ",$dp[9]); 

echo json_encode($dp);
}
 ?>

我知道它看起来还不漂亮,但这就是 CSS 的用途吗?

有任何想法吗?本质上,我需要 PHP 脚本重新运行、更新变量并重建文本输出,而无需触及音频标签。

4

4 回答 4

1

Javascript 是在客户端(在网站访问者机器上)执行的代码,而 PHP 是在服务器端执行的代码。在不重新加载整个页面的情况下将内容插入页面的方法是使用 Javascript 将代码注入 HTML。现在,例如,假设您的服务器上有一个名为 getLatest.php 的 PHP 文件,其中包含一个名为 getLatestVariables() 的函数,该函数找出所有变量的最新值并返回一个包含它们的数组。你可以做的是使用javascript从getLatest.php调用getLatestVariables(),当函数返回数组时,它会将它返回给javascript。一旦变量数组返回到 javascript,您就可以将变量插入 HTML div,而无需刷新整个页面。

调用 php 函数我建议使用 jquery 执行 ajax 调用也插入从 php 返回的数据,jquery 也是你最好的选择。

于 2012-10-03T11:03:21.837 回答
0

为此,您需要客户端 JavaScript。掌握基本的 ajax 书籍。您可以请求脚本每 5 秒更新一次数据并在页面上更新,这很复杂,需要一些 JavaScript 知识。该脚本也必须是新的,或者编辑此脚本以跟踪请求类型并相应地返回数据。

var url="http://script-address"
var req = new XMLHttpRequest(); // Begin a new request
req.open("GET", url); // An HTTP GET request for the url
req.send(null);

这是您可以检查响应的方式

req.onreadystatechange = function() {
if (req.readyState == 4 && req.status == 200) {
//we got a complete valid HTTP response
var response = req.responseText; 
//code to handle response
}
于 2012-10-03T10:29:05.060 回答
0

php 是一种服务器端语言,因此在页面中重新运行 php 将始终导致整个页面刷新,但是如果您对不同的 php 文件使用 javascript ajax 调用(我建议使用 jquery),则可以执行该 php 文件服务器端而不影响您的页面。然后,您可以将此 php 文件中新找到的变量返回到 javascript,并将它们插入到 ajax 调用的回调中。

看到这个问题的答案

如果您需要更多详细信息,请告诉我...

于 2012-10-03T10:35:16.733 回答
0
    $.getJSON('phpFileThatReturnsJSON.php', function(data) {
//'data' will be the json that is returned from the php file
$.("#idOfDivToInsertData").html("an item from the json array ie data['song']");
});

查看 ajax 调用的 JQuery 文档,如果你已经做到了这一点,你应该能够很快地完成它。也不要忘记在您的 html 标头中包含 jquery 库...

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
于 2012-10-04T15:19:15.283 回答