Html自动刷新表格

发布于 2024-11-17 12:03:58 字数 943 浏览 2 评论 0原文

我写了这个简单的代码和这个我已连接到 mysql 数据库的表。它获取我插入数据库中的数据，我想要的是页面自动刷新，而不必刷新整个页面。
我的代码：

<html>
    <head>
        <title>Whats Up?</title>
    </head>
    <body>
        <a href="Register.php">Register</a> <a href="login.php">Login</a>


<?php
    mysql_connect('localhost', 'root');
    mysql_select_db('summerinstitute');
    $query="SELECT * FROM students";
    $result=mysql_query($query);
    echo "<table border=\"1\">";
    while ($row = mysql_fetch_assoc($result)) {
    echo "<tr>";
    echo "<td>";
    echo $row['fname'];
    echo "</td>";
    echo "<td>";
    echo $row['lname'];
    echo "</td>";
    echo "<td>";
    echo $row['username'];
    echo "</td>";
    echo "<td>";
    echo $row['Email'];
    echo "</td>";
    echo "</tr>";}
    ?>
    </body>
</html>

原文

I wrote this simple code and this table which I have connected to mysql database. It fetches the data I inserted in my database what I want is for the page to automatically refresh on its own without having to refresh the whole page.
My Code:

<html>
    <head>
        <title>Whats Up?</title>
    </head>
    <body>
        <a href="Register.php">Register</a> <a href="login.php">Login</a>


<?php
    mysql_connect('localhost', 'root');
    mysql_select_db('summerinstitute');
    $query="SELECT * FROM students";
    $result=mysql_query($query);
    echo "<table border=\"1\">";
    while ($row = mysql_fetch_assoc($result)) {
    echo "<tr>";
    echo "<td>";
    echo $row['fname'];
    echo "</td>";
    echo "<td>";
    echo $row['lname'];
    echo "</td>";
    echo "<td>";
    echo $row['username'];
    echo "</td>";
    echo "<td>";
    echo $row['Email'];
    echo "</td>";
    echo "</tr>";}
    ?>
    </body>
</html>

分享到QQ

分享到微博

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

发布评论

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

中二柚 2024-11-24 12:03:58

您需要使用 javascript 和一些 ajax 实现来仅刷新页面的一部分。

例如使用 jQuery:

php page1.php:

<html>
    <head>
        <title>Whats Up?</title>
    </head>
    <body>
        <a href="Register.php">Register</a> <a href="login.php">Login</a>
        <?php include_once('page2.php')?>
    </body>
</html>

php page2.php:

<?php
    mysql_connect('localhost', 'root');
    mysql_select_db('summerinstitute');
    $query="SELECT * FROM students";
    $result=mysql_query($query);
    echo "<table border='1' id='tableID'>";
    while ($row = mysql_fetch_assoc($result)) {
    echo "<tr>";
    echo "<td>";
    echo $row['fname'];
    echo "</td>";
    echo "<td>";
    echo $row['lname'];
    echo "</td>";
    echo "<td>";
    echo $row['username'];
    echo "</td>";
    echo "<td>";
    echo $row['Email'];
    echo "</td>";
    echo "</tr>";}
    ?>

page1.php 上的 Javascript（将其放在标题中）：

<script type='text/javascript'>
   $(function(){
       $.get('page2.php',{},function(data){
           $('#tableID').replaceWith($(data));  
       });
   });
</script>

You need to use javascript and some ajax implementation to only refresh a part of the page.

For example with jQuery:

php page1.php:

<html>
    <head>
        <title>Whats Up?</title>
    </head>
    <body>
        <a href="Register.php">Register</a> <a href="login.php">Login</a>
        <?php include_once('page2.php')?>
    </body>
</html>

php page2.php:

<?php
    mysql_connect('localhost', 'root');
    mysql_select_db('summerinstitute');
    $query="SELECT * FROM students";
    $result=mysql_query($query);
    echo "<table border='1' id='tableID'>";
    while ($row = mysql_fetch_assoc($result)) {
    echo "<tr>";
    echo "<td>";
    echo $row['fname'];
    echo "</td>";
    echo "<td>";
    echo $row['lname'];
    echo "</td>";
    echo "<td>";
    echo $row['username'];
    echo "</td>";
    echo "<td>";
    echo $row['Email'];
    echo "</td>";
    echo "</tr>";}
    ?>

Javascript on page1.php (put it in the header):

<script type='text/javascript'>
   $(function(){
       $.get('page2.php',{},function(data){
           $('#tableID').replaceWith($(data));  
       });
   });
</script>

回复收藏 0 原文

洛阳烟雨空心柳 2024-11-24 12:03:58

查看

http://en.wikipedia.org/wiki/Ajax_%28programming%29

它会回答你的问题

回复收藏 0 原文

千笙结 2024-11-24 12:03:58

阿贾克斯

    <script type="text/javascript">

        function Ajax()
        {
            var
                $http,
                $self = arguments.callee;

            if (window.XMLHttpRequest) {
                $http = new XMLHttpRequest();
            } else if (window.ActiveXObject) {
                try {
                    $http = new ActiveXObject('Msxml2.XMLHTTP');
                } catch(e) {
                    $http = new ActiveXObject('Microsoft.XMLHTTP');
                }
            }

            if ($http) {
                $http.onreadystatechange = function()
                {
                    if (/4|^complete$/.test($http.readyState)) {
                        document.getElementById('ReloadThis').innerHTML = $http.responseText;
                        setTimeout(function(){$self();}, 10000);
                    }
                };
                $http.open('GET', 'random.php' + '?' + new Date().getTime(), true);
                $http.send(null);
            }

        }

    </script>

</head>
<body>

    <script type="text/javascript">
        setTimeout(function() {Ajax();}, 10000);
    </script>
    <div id="ReloadThis">Default text</div>

</body>

Ajax

    <script type="text/javascript">

        function Ajax()
        {
            var
                $http,
                $self = arguments.callee;

            if (window.XMLHttpRequest) {
                $http = new XMLHttpRequest();
            } else if (window.ActiveXObject) {
                try {
                    $http = new ActiveXObject('Msxml2.XMLHTTP');
                } catch(e) {
                    $http = new ActiveXObject('Microsoft.XMLHTTP');
                }
            }

            if ($http) {
                $http.onreadystatechange = function()
                {
                    if (/4|^complete$/.test($http.readyState)) {
                        document.getElementById('ReloadThis').innerHTML = $http.responseText;
                        setTimeout(function(){$self();}, 10000);
                    }
                };
                $http.open('GET', 'random.php' + '?' + new Date().getTime(), true);
                $http.send(null);
            }

        }

    </script>

</head>
<body>

    <script type="text/javascript">
        setTimeout(function() {Ajax();}, 10000);
    </script>
    <div id="ReloadThis">Default text</div>

</body>

回复收藏 0 原文

永不分离 2024-11-24 12:03:58

使用 jQuery

setTimeout(function refreshTable() {
$.ajax({
    url:'/some-script.php',
    dataType:'html',
    data:{
       someparam:'someval'
    },
    success:function(data) {
        $('#yourTable').find('tbody').empty().append(data);
        setTimeout(refreshTable, 5000);
    }
 });
}, 5000); //every 5 seconds refresh

Using jQuery

setTimeout(function refreshTable() {
$.ajax({
    url:'/some-script.php',
    dataType:'html',
    data:{
       someparam:'someval'
    },
    success:function(data) {
        $('#yourTable').find('tbody').empty().append(data);
        setTimeout(refreshTable, 5000);
    }
 });
}, 5000); //every 5 seconds refresh

回复收藏 0 原文

恋竹姑娘 2024-11-24 12:03:58

我没有对 PHP 做太多工作，但您可能希望 PHP 在它自己的单独页面上创建表，然后在您想要刷新表时使用 AJAX 来获取数据。如果你使用 dojo 你可以做这样的事情。

index.html

<html>
<head>
    <script type="text/javascript">
    //call this function whenever you want to update the table
    function updateTable()
    {
        dojo.xhrGet({
            url: 'my_table.php',
            handleAs: 'text',
            load: function(data) {
                dojo.byId('table').innerHTML = data;
            });
    }
    </script>
    <title>Whats Up?</title>
</head>
<body onload='updateTable()'>
    <a href="Register.php">Register</a> <a href="login.php">Login</a>

<div id='table'></div>
    </body>
</html>

my_table.php

<?php
    mysql_connect('localhost', 'root');
    mysql_select_db('summerinstitute');
    $query="SELECT * FROM students";
    $result=mysql_query($query);
    echo "<table border=\"1\">";
    while ($row = mysql_fetch_assoc($result)) {
    echo "<tr>";
    echo "<td>";
    echo $row['fname'];
    echo "</td>";
    echo "<td>";
    echo $row['lname'];
    echo "</td>";
    echo "<td>";
    echo $row['username'];
    echo "</td>";
    echo "<td>";
    echo $row['Email'];
    echo "</td>";
    echo "</tr>";}
    ?>

I haven't done much with PHP, but you probably want that PHP that creates the table on it's own separate page, and then use AJAX to get the data whenever you want to refresh the table. If you use dojo you could do something like this.

index.html

<html>
<head>
    <script type="text/javascript">
    //call this function whenever you want to update the table
    function updateTable()
    {
        dojo.xhrGet({
            url: 'my_table.php',
            handleAs: 'text',
            load: function(data) {
                dojo.byId('table').innerHTML = data;
            });
    }
    </script>
    <title>Whats Up?</title>
</head>
<body onload='updateTable()'>
    <a href="Register.php">Register</a> <a href="login.php">Login</a>

<div id='table'></div>
    </body>
</html>

my_table.php

<?php
    mysql_connect('localhost', 'root');
    mysql_select_db('summerinstitute');
    $query="SELECT * FROM students";
    $result=mysql_query($query);
    echo "<table border=\"1\">";
    while ($row = mysql_fetch_assoc($result)) {
    echo "<tr>";
    echo "<td>";
    echo $row['fname'];
    echo "</td>";
    echo "<td>";
    echo $row['lname'];
    echo "</td>";
    echo "<td>";
    echo $row['username'];
    echo "</td>";
    echo "<td>";
    echo $row['Email'];
    echo "</td>";
    echo "</tr>";}
    ?>

回复收藏 0 原文

~没有更多了~