JavaScript window.onload

标签 javascript html dom-events

<!DOCTYPE html>  
<html>  
<head>  

    <script type="text/javascript" >
                 
               function changeTitle() {                      
                  if (document.getElementById('myText').value === "") {                     
                     document.getElementById('title').innerHTML = "Welcome to JavaScript";  
                     alert("Enter a valid text title");  
                     return;                      
                  } else {                        
                  document.getElementById('title').innerHTML = document.getElementById('myText').value;  
                  
                  }  
               }                                
      </script>           
</head>          
<body>  
    <h1 id="title">Welcome to JavaScript</h1>      
    <p> Hello! This is my first JavaScript example on Microsoft Visual Studio Express Edition 2013.</p>          
    <p>  
        <input id="myText" type="text"/>  
        <input type="submit" onclick="changeTitle();" value="Click me!"/>  
    </p>      
</body>  
</html>  

在这个小例子中,我想在第一次加载页面后将 h1 标签 (id=title) 的初始innerHTML 保存到一个变量中。

然后,我想用短语 < 替换上面提到的变量,而不是 if 语句中的 document.getElementById('title').innerHTML = 'Welcome to JavaScript'强>“欢迎使用 JavaScript”。

我的主要目的是, 每当有人将文本框 (id=myText) 留空并单击提交按钮时,脚本应将 h1 标记 (id=title) 的innerHTML 替换为初始值第一页加载中存在的值并弹出该警报框。 (也许用户之前更改了 h1 的innerHTML,但脚本应该将其替换为第一个页面加载时的初始值)。

最佳答案

您可以声明隐藏输入。

<input type="hidden" id="initialTitle" value=""/>

并通过 body onload JS 函数填充隐藏字段值。

function setInitialTitle() { document.getElementById('initialTitle').value = document.getElementById('title').innerHTML }


<body onload="setInitialTitle()";>

并在changeTitle()函数中重写if block 为。

document.getElementById('title').innerHTML = document.getElementById('initialTitle').value;

关于JavaScript window.onload,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20441973/

相关文章:

javascript - HTML5 Canvas - 暂停时耗时

javascript - 我应该总是删除 EventListener 吗?

javascript - 错误: [$injector:nomod] when attempting to add 3rd party module to mean app.

JavaScript 单击 addEventListener 不适用于我的代码

javascript - Jquery使用var而不是number删除索引

javascript - 将 HTML 表单架构保存到 JSON

html - Bootstrap/浏览器宽度计算问题

javascript - 创建某个标签时是否有可能引发事件?

angular - 回车键是否触发点击事件?

javascript - 实现 removeProperty 函数