Question

我已经注册了自定义帖子类型，并且我已经为其创建了自定义列，这些列之一被倒计时了，它的功能是从我已经设置的自定义元日期和时间中削减NowTime，因此我通过javascript获得了它的功能，很好，但是对于所有行它只得到一个值，这是我的代码：

这是已注册的列

case 'reminder':
    $reminder = remider_text();

    break;

这是javascript的功能

function remider_text(){
$date = get_post_meta($post_id, 'booking_date', true);
$date_format = "M d, Y";
$meta = (!empty($date)) ? date($date_format, $date) : "";
$time = get_post_meta($post_id, 'time', true);
$data = $meta ." ". $time;

if ($data == '') {
echo 'N/A';
?>
<?php
} else { ?>
              <div id="countdown"></div>

<script>
console.log(data)
// Set the date we're counting down to
var countDownDate = new Date(data).getTime();

// Update the count down every 1 second
var x = setInterval(function() {

// Get todays date and time
var now = new Date().getTime();

// Find the distance between now and the count down date
var distance = countDownDate - now;

// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 
* 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);

// Output the result in an element with id="demo"
var elms = document.querySelectorAll("[id='countdown']");
for(var i = 0; i < elms.length; i++) 
elms[i].innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";

// Changing text color
var elms_color = document.querySelectorAll("[id='countdown']");
for(var i = 0; i < elms_color.length; i++) 
elms_color[i].style.color = days === 0 && hours < 3 ? 'red' : '';

 // Changing text color
 var elms_color = document.querySelectorAll("[id='countdown']");
for(var i = 0; i < elms_color.length; i++) 
elms_color[i].style.color = days === 2 && hours < 5 ? 'orange' : '';

// If the count down is over, write some text 
if (distance < 0) {
    clearInterval(x);
    for(var i = 0; i < elms.length; i++) 
    elms[i].innerHTML = "Outdated";
}
}, 1000);
</script>
  <?php }
 ?>
<?php}

这是发布元日期和时间值

Aug 13, 2019 14:00
Oct 27, 2018 14:00
Oct 19, 2018 14:00
Oct 13, 2018 13:00
Oct 25, 2019 14:00
Oct 08, 2018 07:00

我也尝试过这种方法，但是我又只得到一个值

function remider_text()
{
$date = get_post_meta($post_id, 'booking_date', true);
$date_format = "M d, Y";
$meta = (!empty($date)) ? date($date_format, $date) : "";
$time = get_post_meta($post_id, 'time', true);
$data = $meta . " " . $time;

if ($data == '') {
    echo 'N/A';
    ?>
    <?php
} else {
    $temp2 = $data;
    $test = $i . 'test';
    $i++;
    ?>
    <div id="<?php print $test;?>"></div>

    <script type="text/javascript">

      dateFuture1 = new Date(<?php print $temp2;?>);

      function GetCount(ddate,iid){
      console.log(data)

      dateNow = new Date(); //grab current date
    amount = ddate.getTime() - dateNow.getTime();   //calc milliseconds 
      between dates
    delete dateNow;


    // if time is already past
    if(amount < 0){
      document.getElementById(iid).innerHTML="Now!";
    }
    // else date is still good
    else{
      mins=0;secs=0;out="";

      amount = Math.floor(amount/1000);//kill the "milliseconds" so 
        just secs

      mins=Math.floor(amount/60);//minutes
      amount=amount%60;

      secs=Math.floor(amount);//seconds

      if(mins != 0){out += (mins<=9?'0':'')+mins +" "+ 
      ((mins==1)?"mins":"mins")+", ";}
      if(secs != 0){out += (secs<=9?'0':'')+secs +" "+ 
      ((secs==1)?"secs":"secs")+", ";}
      out = out.substr(0,out.length-2);
      document.getElementById(iid).innerHTML=out;

      setTimeout(function(){GetCount(ddate,iid)}, 1000);
      }
      }
      window.onload=function(){
    GetCount(dateFuture1, '<?php print $test;?>');
      };
    </script>
            <?php }
      ?>
      <?php }

自定义帖子类型列倒计时

0 个答案: