Question

＆＃13;

<script> 
    function closeit(){ 
    document.getElementById('avviso').setAttribute("style", "display:none");
} 
setTimeout("closeit", 3000);
</script>

＆＃13;

#avviso{ 
    width:200px; /* Larghezza del box */ 
    padding:5px; position:fixed; z-index:5000;} 
    .box-avviso{ 
    border:4px double #940F04; /* Colore del bordo */ 
    -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 8px 8px 6px #909090; -moz-box-shadow: 8px 8px 6px #909090; box-shadow: 8px 8px 6px #909090; 
    background-color: #FFEAE9; /* Colore di sfondo */ 
    padding: 8px; font-family: Verdana, Geneva, sans-serif; 
    color: #003366; /* Colore del testo */ 
    } 
    .testo-avviso { /* Stile di AVVISO */ 
    font-size:18pt; 
    font-weight:bold; 
    color:#B4045F; 
    text-shadow: 0px 0px 10px #BA55D3;}

＆＃13;

 <div id="avviso" style="left:20px; top:100px; padding:0;"> 
    <div align="right" style="margin-bottom:-15px;"><b>
<a href="javascript:closeit()" >
<font face="Arial" size="1">CHIUDI</font>&nbsp;<img valign="middle" src="https://lh6.googleusercontent.com/-80LmoXXMIi0/TnsyYeeRVnI/AAAAAAAAUgc/RShnbWF2L_c/chiudi.png" style="vertical-align:middle;" border="0"/></a></b></div> 
    <br/> 
    <fieldset class="box-avviso"> 
    <legend class="testo-avviso" align="center"></legend> 
      Nuova Comunicazione<br/>
    </fieldset>
    </div>

＆＃13;

可以自动关闭此窗口Javascript，并每隔10秒创建一条新消息吗？

Answer 1

setInterval（）：重复调用函数或执行代码段，每次调用之间有固定的时间延迟。返回intervalID。

是的，您可以使用 setInterval() 代替setTimeout()：

setInterval(closeit, 10000); //NOTE Removing double quotes arround function name

注意：您可以使用.style来管理css属性，而不是setAttribute()：

document.getElementById('avviso').style.display="none";

希望这有帮助。

function closeit(){ 
  document.querySelectorAll('.box-avviso')[0].textContent = "New message";
} 
setInterval(closeit, 3000);

#avviso{ 
  width:200px; /* Larghezza del box */ 
  padding:5px; position:fixed; z-index:5000;} 
.box-avviso{ 
  border:4px double #940F04; /* Colore del bordo */ 
  -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 8px 8px 6px #909090; -moz-box-shadow: 8px 8px 6px #909090; box-shadow: 8px 8px 6px #909090; 
  background-color: #FFEAE9; /* Colore di sfondo */ 
  padding: 8px; font-family: Verdana, Geneva, sans-serif; 
  color: #003366; /* Colore del testo */ 
} 
.testo-avviso { /* Stile di AVVISO */ 
  font-size:18pt; 
  font-weight:bold; 
  color:#B4045F; 
  text-shadow: 0px 0px 10px #BA55D3;}

<div id="avviso" style="left:20px; top:100px; padding:0;"> 
  <div align="right" style="margin-bottom:-15px;"><b>
    <a href="javascript:closeit()" >
      <font face="Arial" size="1">CHIUDI</font>&nbsp;<img valign="middle" src="https://lh6.googleusercontent.com/-80LmoXXMIi0/TnsyYeeRVnI/AAAAAAAAUgc/RShnbWF2L_c/chiudi.png" style="vertical-align:middle;" border="0"/></a></b></div> 
  <br/> 
  <fieldset class="box-avviso"> 
    <legend class="testo-avviso" align="center"></legend> 
    Nuova Comunicazione<br/>
  </fieldset>
</div>

Javascript打开关闭新消息

1 个答案: