0

正如标题所说,是否可以在 div 内没有另一个 html 或 php 页面的情况下刷新 div?

例如,这是可以使用 javascript 完成的:

  $(document).ready(function () {
     $('#mydiv').delay(10000).load('page.php');
  });

我的 Div 显示/保存从 mysql 数据库中提取的数据,但其中没有page.php

我已经搜索过这个,所有结果都与我上面发布的相似!

这甚至可能吗?如果可以,怎么办?

编辑:

当前显示在 DIV 中的数据是$end_time项目的数据。$end_time基本上datetime是存储在mysql数据库中的一个。已经在$end_time滴答作响(使用 javascript 的倒数计时器)。有一个按钮,只要按下,1分钟就会添加到$end_timemysql中。

但是当按下按钮时,我需要刷新/重新加载页面才能查看更改(在这种情况下,倒数计时器添加了 1 分钟)。

我需要做的是在按下该按钮后重新加载 DIV,以便所有用户都可以看到倒数计时器已添加 1 分钟,而无需重新加载或刷新页面。

编辑:

这是我的完整代码,它可以正常工作,它会从 mysql 数据库中提取数据,所以我对项目的这一部分没有问题:

<?php 
error_reporting(E_ALL);
ini_set('display_errors', '1');
?>
<?php date_default_timezone_set('Europe/London'); ?>
<?php
session_start();
// Run a select query to get my letest 6 items
// Connect to the MySQL database  
include "config/connect.php";
$dynamicList = "";
$sql = "SELECT * FROM item ORDER BY id";
$query = mysqli_query($db_conx, $sql);
$productCount = mysqli_num_rows($query); // count the output amount
if ($productCount > 0) {
    while($row = mysqli_fetch_array($query, MYSQLI_ASSOC)){ 
             $id = $row["id"];
             $product_name = $row["product_name"];
             $date_added = date("Y-m-d", strtotime($row["date_added"]));
             $end_date = date("F d Y H:i:s T", strtotime($row["end_date"]));
             $price = $row["price"];
             $dynamicList .= '<div>' . $end_date . '
      </div>';
    }
} else {
    $dynamicList = "No Records";
}
?>

<?php
$date = $end_date;
$exp_date = strtotime($date);
$now = time();

if ($now < $exp_date ) {
?>
<script>
// Count down milliseconds = server_end - server_now = client_end - client_now
var server_end = <?php echo $exp_date; ?> * 1000;
var server_now = <?php echo time(); ?> * 1000;
var client_now = new Date().getTime();
var end = server_end - server_now + client_now; // this is the real end time

var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour *24
var timer;

function showRemaining()
{
    var now = new Date();
    var distance = end - now;
    if (distance < 0 ) {
       clearInterval( timer );
       document.getElementById('countdown').innerHTML = 'EXPIRED!';

       return;
    }
    var days = Math.floor(distance / _day);
    var hours = Math.floor( (distance % _day ) / _hour );
    var minutes = Math.floor( (distance % _hour) / _minute );
    var seconds = Math.floor( (distance % _minute) / _second );

    var countdown = document.getElementById('countdown');
    countdown.innerHTML = '';
   if (days) {
        countdown.innerHTML += 'Days: ' + days + '<br />';
    }
    countdown.innerHTML += 'Hours: ' + hours+ '<br />';
    countdown.innerHTML += 'Minutes: ' + minutes+ '<br />';
    countdown.innerHTML += 'Seconds: ' + seconds+ '<br />';
}

timer = setInterval(showRemaining, 1000);
</script>
<?php
} else {
    echo "Times Up";
}
?>
<div id="result"><div id="countdown"></div></div>

<?php echo $end_date; ?> </br>


<?php echo $dynamicList; ?>

<script src="ajax_link.js" type="text/javascript"></script>


<div id="ajaxlink" onclick="loadurl('timeadder.php')">Click here</div>


<input type="submit" name="ajaxlink" id="ajaxlink" value="Submit" onclick="loadurl('timeadder.php')"/>

这是将 1 分钟添加到数据库的页面的代码,这也应该如此:

时间加法器.php

<?php 
error_reporting(E_ALL);
ini_set('display_errors', '1');
?>

<?php

session_start();
// Run a select query to get my letest 6 items
// Connect to the MySQL database  
include "config/connect.php";
$sql = "UPDATE item SET end_date = DATE_ADD(end_date,INTERVAL 1 MINUTE) WHERE id = 1;";

$query = mysqli_query($db_conx, $sql);


?>

我需要做的就是刷新countdown保存计时器的 DIV。

我希望现在有人可以提供帮助。

4

4 回答 4

1

问题尚不清楚,但是如果您尝试定期将 php 加载到 div 中,则可以使用setInterval

setInterval(
   function(){
       $('#mydiv').load('page.php');
  },10000);

编辑:

好的,然后我建议Jquery.get

setInterval(function(){
  $.get('page.php',function(timerValue){
     $('#mydiv').html(timerValue);
   });
 },1000);
于 2013-09-19T15:12:29.167 回答
1

修改为在 OP 中集成新发布的代码:

在您的while{}声明中,您在结束日期周围粘贴了 div 标签,但是没有简单的方法来确定 div 属于哪个项目的结束日期。

建议:

$dynamicList .= '<div id="ed-' .$id. '">' . $end_date . '</div>';

这将在每个结束日期周围创建一个唯一命名的 div。现在,您可以通过 jQuery 访问特定的结束日期,因此:

$('#ed-3').html(newdata);

另外,不应该这样:

<div id="result"><div id="countdown"></div></div>
<?php echo $end_date; ?> </br>

像这样:

<div id="result"><div id="countdown"><?php echo $end_date; ?></div></div>
</br>

HTML:

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        
        <script type="text/javascript">
        
            var item_id = 0;
            
            $(document).ready(function() {
            
                $('#mybutt').click(function() {
                    item_id = $(this).attr('id').split('-')[1];
                    updateTimer();
                });

            
            }); //END $(document).ready()
            
            function updateTimer() {
                $.ajax({
                    type: 'POST',
                    url: 'getenddate.php`,
                    data: `item=` + item_id,
                    success: function(fromPhp) {
                        $('#countdown').html(fromPhp);
                        
                        //or, to change this item's end date as echoed out from $dynamicList:
                        //$('#ed-' + item_id).html(fromPHP);
                    } //END success fn
                }); //END AJAX code block
                adder = 0;
            } //END updateTimer fn

        </script>
    </head>
<body>

    <div id="countdown"></div>
    <input id="item-12" type="button" value="Add One Minute">


</body>
</html>

PHP:getenddate.php

<?php

    //item is NAME of var being posted over (key), 
    //item_id is the var contents on the client side ONLY
    //$_POST['item'] is var contents (value) as it arrives on PHP side
    $itemid = $_POST['item'];

    // ** FIXME the query contains a SQL injection vuln,
    // ** please untaint $itemid before using

    //code to return current time value from database - runs every time
    $end = mysql_result(mysql_query("SELECT `end_date` FROM item WHERE `id` = '$item' "), 0);
    
    echo $end;
    
于 2013-09-19T17:55:42.043 回答
0

如果我理解正确,您想更改 DIV 的内容,无论里面是什么。这可以像这样完成:

在 HTML 中你有类似的东西:

<div id="mydiv">My old content, no sites here</div>

在你做的 JS(启用 jQuery)中(例如在 ready 函数中):

$(document).ready(function () {
   $('#mydiv').html("This content is brand new");
});

上面代码的jsFiddle

.html()函数删除该标签的旧内容并用新内容替换它。

例如,如果您想显示当前秒数,您可以执行以下操作:

$(document).ready(function () {
    setInterval(function(){
      // change time
      $('#mydiv').html("Seconds: "+ new Date().getSeconds());
    },1000); 
});

带有计数器的代码的jsFiddle

于 2013-09-19T15:13:17.490 回答
0

这应该几乎正是您正在寻找的(未经测试):

HTML:

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

        <script type="text/javascript">
            var adder = 0; //Global var -- outside document.ready

            $(document).ready(function() {

                $('#mybutt').click(function() {
                    adder++;
                    updateTimer();
                });


            }); //END $(document).ready()

            function updateTimer() {
                $.ajax({
                    type: 'POST',
                    url: 'myphpprocessor.php',
                    data: 'addval=' + adder,
                    success: function(fromPhp) {
                        $('#theTimer').html(fromPhp);
                    } //END success fn
                }); //END AJAX code block
                adder = 0;
            } //END updateTimer fn

        </script>
    </head>
<body>

    <div id="theTimer"></div>
    <input id="mybutt" type="button" value="Add One Minute">


</body>
</html>

PHP: myphpprocessor.php

<?php

    $howmuch = $_POST['addval'];

    if ($howmuch > 0) {
        //code to update database by the amount
        //  - only runs if howmuch has a value
    }

    //code to return current time value from database - runs every time
    $thetime = mysql_query('SELECT etc etc etc');

    echo $thetime;

笔记:

  1. 数据库只需要存储要加到当前时间的分钟数
  2. 然后,您的 PHP 代码可以:
    (a) 查询数据库中要添加的分钟数:$num_mins_to_add
    (b) 创建一个具有当前时间的新日期对象
    (c) 将 $num_mins_to_add 添加到 (b) (d) ECHO 返回值
于 2013-09-19T16:02:07.270 回答