时间戳

首页 > 解决方案 > 如何使用 javascript 函数的输出在 HTML 中显示

javascript - 如何使用 javascript 函数的输出在 HTML 中显示

问题描述

我正在制作一个模拟网站来练习使用 HTML、CSS 和 javascript。我希望用户能够单击将出现叠加层的图像，并在屏幕上显示约会日期。当我尝试显示函数的输出时，什么也没有发生。

我尝试调用函数、特定的输出变量以及“Date.prototype.getNextWeekDate”本身。

<script>
Date.prototype.getNextWeekDay = function(d) {
  if (d) {
    var next = this;
    next.setDate(this.getDate() - this.getDay() + 7 + d);
    return next;
  }
}

var now = new Date();
var nextMonday = now.getNextWeekDay(1); // 0 = Sunday, 1 = Monday, ...
return nextMonday;  
</script>

<style>
#overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 2;
  cursor: pointer;
}

#text{
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 50px;
  color: white;
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
}
</style>

<div id="overlay" onclick="off()">
  <div id="text">
    <p>Your appointment is at:<script>fucntion(d);</script></p>

  </div>
</div>


<script>
function on() {
  document.getElementById("overlay").style.display = "block";
}

function off() {
  document.getElementById("overlay").style.display = "none";
}
</script>


<img src="images/m&R_Idk.jpg" width="500" height="298" alt="Mechanic Appointment"
       onClick="on()" >

7 天内的当前日期应输出到叠加层上，但根本没有输出。

标签： javascripthtml

解决方案

推荐阅读