Ajax、PHP、MySQL检索数据

Question

我正在尝试在特定div中从mysql服务器自动检索数据，而无需手动刷新网页。

我的PHP代码是：

function lastCodes(){
    include('mysql.php');
    include('config.php');
echo "<div id='content_data'>";
    $get = mysql_query("SELECT * FROM scripts ORDER by date_added DESC");
    if(mysql_num_rows($get)>0){
        while($row = mysql_fetch_assoc($get)){
            $get2 = mysql_query("SELECT * FROM accounts WHERE username = '$row[s_owner]'");
                while($red = mysql_fetch_assoc($get2)){
            echo "<table>
                        <tr>
                                <td width='22px'>";
                        if(!empty($red['avatar'])){
                            echo "<center>
                                        <img src='$red[avatar]' style='width: 52px; height: 52px; margin-left: -30px; border: 2px solid #fff;' title='$row[s_owner]'/>
                                    </center>
                                </td>";
                        } else {
                            echo "<td width='22px'>
                                        <center>
                                            <img src='/theme/$tema/icons/empty_avatar.png' style='width: 52px; height: 52px;' title='$row[s_owner]'/>
                                        </center>
                                    </td>";
                        }       
            echo "<td>
                        <a style='font-family: IndexName; color: #000; font-size: 14px; margin-left: 5px;'><b>$row[s_owner]</b> написа <a title='$row[s_name], Категория: $row[s_category].' href='#' style='text-decoration: none;'>нов код</a> <a style='font-family: IndexName; color: #000; font-size: 14px; margin-right: 10px;'>в $row[date_added]</a>
                    </td>
                    </tr>
                    </table>";
        }
        }
    }
echo "</div>";
}

如果我想在DIV中每隔5秒检索一次名为"content_data"的信息，那么jquery/ajax代码应该是什么？非常感谢！

Answer 1

您可以将lastCodes（）函数的内容放在一个空的PHP文件中，我们称之为lastCodes.PHP。

然后在要检索数据的页面上使用JQuery的加载函数

<div id="divTarget"></div>
<script type="text/javascript">
    $("#divTarget").load("lastCodes.php");
</script>

但请记住，这种编码方式可能会很快变得一团糟。我建议您尝试许多可用的优秀模板系统中的任何一个。对于干净的代码来说，这是不必要的，但如果没有干净的代码，您将需要一些规则来将逻辑排除在代码视图之外。

当你对其中一个感到满意时，你可以更进一步，在前端使用Javascript尝试一个模板系统，例如Handlebars。有了其中的一个，您将能够编写干净的代码，并使用JSON发送数据，这将降低HTTP响应的大小，同时使数据更适用于其他场景，而不是简单地将其呈现为HTML。

编辑：每5秒更新一次数据：

<script type="text/javascript">
  window.setInterval(function() {    
     $("#divTarget").load("lastCodes.php");
  }, 5000);
</script>

Answer 2

您只需要使用setInterval（）函数每隔5秒（5000毫秒）加载一次页面内容

</div>
<script src="jquery.js"></script>
<script>
setInterval(function(){
   $('#container').load('page.php');
}, 5000);
</script>

我可以看到你有一个函数，所以你可以调用它。如果这不起作用，那么试着把你的代码放在函数之外。

lastCodes();

确保它确实更改了内容，并且您调用的页面确实有效，您可以通过访问页面本身来测试它，看看它是否有任何输出。