时间戳

首页 > 解决方案 > 我想在 div 中显示 js 的结果

javascript - 我想在 div 中显示 js 的结果

问题描述

我想在 div 或 php 中显示此示例的结果

<script>
   function dateformat()
   {
     var date = document.getElementById('date').value;
     date = moment(date).format('D MMMM YYYY');
     document.write(date)
     return false;
    }
</script>

<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<form onsubmit="return dateformat()" action="<?=$_SERVER['PHP_SELF'];?>" method="post">
   <input type="date" name="date" id="date" >
   <input type="submit" onsubmit="return dateformat()">
</form>

<?php echo $_POST["date"]; ?>

如何修改该代码以使用这种格式的 PHP：DAY August 2019

<?php echo $_POST["date"]; ?>

标签： javascriptphphtmlforms

解决方案

为什么要使用 php 执行此操作？这需要你做一个额外的服务器请求，因此会导致更多的延迟和更糟糕的用户体验，而不是使用 Javascript 并只是更改一个元素。

只需添加一个元素来添加结果并替换document.write(date)by即可document.getElementById("result").innerText = date;完美解决问题。

function dateformat() {
  var date = document.getElementById('date').value;
  date = moment(date).format('D MMMM YYYY');
  document.getElementById("result").innerText = date;
  return false;
}
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<form onsubmit="return dateformat()" action="<?=$_SERVER['PHP_SELF'];?>" method="post">
  <input type="date" name="date" id="date">
  <input type="submit" onsubmit="return dateformat()">
</form>
<div id="result"></div>

推荐阅读