如何使用onload javascript顯示html內容？

-1

我想使用HTML，CSS和JavaScript做一個登錄表單，它工作正常。但問題是，它沒有顯示我的html內容，它只顯示另一頁上的用戶名。誰能幫幫我嗎？我希望target.html頁面顯示我的html內容和用戶名。如何使用onload javascript顯示html內容？

的index.html

<html> 
    <head> 
    <title>Login page</title> 
    </head> 
    <body> 
    <h1 style="font-family:Comic Sans Ms;text-align="center";font-size:20pt; 
     color:#00FF00;> 
    Simple Login Page 
    </h1> 
    <form name="myform"> 
    Username<input type="text" name="userid" id="userid"/> 
    Password<input type="password" name="pswrd"/> 
    <input type="button" onclick="check(this.form)" value="Login"/> 
    <input type="reset" value="Reset"/> 
    </form> 

     <script language="javascript"> 

    function check(form) 
    { 

    if(form.userid.value && form.pswrd.value) 
    { 
     window.location="target.html" 
    alert("Welcome to this page") 
    var userid = document.getElementById("userid").value; 
    localStorage.setItem("userid", userid); 
     } 
    else 
     { 

    alert("Error Password or Username") 
    } 
    } 
    </script> 
    </body> 
    </html>

target.html上

<html> 
<head> 
<title>Login page</title> 
<style> 
h1.text{ 
color: red; 
} 
</style> 
<script> 
function init(){ 
var userid = localStorage.getItem("userid"); 

document.write("Welcome "+userid); 
} 
    window.onload=init; 
</script> 

<body> 
<h1 class="text">Simple Login Page</h1> 
<a href="confirm.html">Confirm.html</a> 

</body> 
</html>

來源

2013-09-22 Akimichi

不要使用'document.write'。 – SLaks

您有多個問題。最糟糕的是document.write。另一種情況是，在位置更改後，當前頁面無法執行任何操作 – mplungjan

使用的onload document.write會導致內容被消滅。

document.write通常被認爲是不好的，所以不要使用它。

More on document.write

來源

2013-09-22 14:39:24 Halcyon

文件撰寫寫入頁面並覆蓋任何現有的HTML。你正在嘗試做什麼，在頁面上添加一些東西。這意味着你可以放置一個佔位符，然後用數據填充它。同樣在你的index.html頁面上，你有很多代碼不會執行，因爲你已經改變了位置。最重要的是localStorage.setItem（「userid」，userid）;它需要移動到您的位置以上才能使target.html工作。

<html> 
<head> 
<title>Login page</title> 
<style> 
h1.text{ 
color: red; 
} 
</style> 
<script> 
function init(){ 
var userid = localStorage.getItem("userid"); 

document.getElementById("username").innerHTML("Welcome "+userid); 
} 
    window.onload=init; 
</script> 

<body> 
<span id='username'></span> 
<h1 class="text">Simple Login Page</h1> 
<a href="confirm.html">Confirm.html</a> 

</body> 
</html>

來源

2013-09-22 14:54:20 scotty

通過放置佔位符並填充數據，意味着什麼。重要的是，什麼是佔位符，我應該添加什麼數據。此外，位置重置的位置在哪裏？ – Akimichi

如何使用onload javascript顯示html內容？

回答

相關問題