如何使用javascript函数的输出在HTML中显示
我正在制作一个模拟网站来练习使用HTML、CSS和javascript。我希望用户能够在一个图像上点击一个覆盖将出现和一个约会日期将显示在屏幕上。当我试图显示函数的输出时,什么也没有发生 我尝试调用函数、特定的输出变量和“Date.prototype.getNextWeekDate”本身如何使用javascript函数的输出在HTML中显示,javascript,html,Javascript,Html,我正在制作一个模拟网站来练习使用HTML、CSS和javascript。我希望用户能够在一个图像上点击一个覆盖将出现和一个约会日期将显示在屏幕上。当我试图显示函数的输出时,什么也没有发生 我尝试调用函数、特定的输出变量和“Date.prototype.getNextWeekDate”本身 Date.prototype.getNextWeekDay=函数(d){ 如果(d){ var next=这个; next.setDate(this.getDate()-this.getDay()+7+d);
Date.prototype.getNextWeekDay=函数(d){
如果(d){
var next=这个;
next.setDate(this.getDate()-this.getDay()+7+d);
下一步返回;
}
}
var now=新日期();
var nextMonday=now.getNextWeekDay(1);//0=周日,1=周一。。。
下星期一返回;
#覆盖层{
位置:固定;
显示:无;
宽度:100%;
身高:100%;
排名:0;
左:0;
右:0;
底部:0;
背景色:rgba(0,0,0,0.5);
z指数:2;
光标:指针;
}
#正文{
位置:绝对位置;
最高:50%;
左:50%;
字体大小:50px;
颜色:白色;
转换:翻译(-50%,-50%);
-ms转换:翻译(-50%,-50%);
}
您的预约时间为:FUNCTION(d)
关于()的函数{
document.getElementById(“覆盖”).style.display=“块”;
}
函数off(){
document.getElementById(“覆盖”).style.display=“无”;
}
7天内的当前日期应输出到覆盖上,但不输出任何内容。浏览器控制台怎么说?
p
元素中的脚本仅在页面解析时执行,并且很可能还会抛出错误(功能未定义
)。删除脚本并将约会日期指定给图像的单击处理程序函数中p
元素的textContent
属性。并从脚本主体中删除return语句。非法的return语句和Function语句需要一个函数name@Teemu-按如下方式调用任意内容:nextMonday.textContent;nextMonday.textContent=StringNope,nextMonday
是日期,如前所述,从脚本正文中删除返回,从p
中删除脚本<代码>返回仅允许在函数内部使用。你需要。。。
<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()" >