隐藏按钮基于小时

Hide button based on hours

本文关键字:小时 于小时 按钮 隐藏      更新时间:2023-09-26

在页面上,Save按钮应该根据系统时间显示或隐藏。我想隐藏保存按钮,每天上午10点后。我的坏代码

<script type="text/javascript">
 var currentTime = new Date();
 var hours = currentTime.getHours();
 var newButton = document.getElementById("btn1");
if(hours>10) {
 newButton.style.display = "none";
//tried this one too
// document.getElementById('btn1').style.visibility = 'hidden';
}
else {
 newButton.style.display = "block";
}
</script>

在HTML代码中我添加了

<input id="btn1" type="button" value="Save" name="btnSave" onclick="javascript: {ddwrt:GenFireServerEvent('__commit')}" />

有任何建议或帮助

你的函数可以非常简单,例如:

window.addEventListener("load", function(){
  var newButton = document.getElementById("btn1");
  newButton.style.visibility = new Date().getHours() > 10? 'none' : '';
});

请注意,按钮的默认显示值是inline-block,但并非所有浏览器都必须使用该值,并且可以使用CSS将其设置为其他值。将display设置为"(空字符串)可以让它采用特定浏览器或样式表的默认或继承样式,并且您不必每次页面设计人员改变主意时都更改代码。

此外,要真正禁用按钮,你应该将它的disabled属性设置为true。

用onload事件包装。你的按钮还没在页面上。尚未呈现的元素不能被寻址。

window.addEventListener("load", function(){
     var currentTime = new Date();
     var hours = currentTime.getHours();
     var newButton = document.getElementById("btn1");
    if(hours>10) {
     newButton.style.display = "none";
    }
    else {
     newButton.style.display = "block";
    }
}, false);

这样,当页面加载并且相关按钮存在时,它就会触发。

或者像Deef评论的那样,把script标签放在页面底部