如何通過單擊另一個html頁面上的按鈕來編輯頁面？

Question

例如，我有一個帶有2個按鈕的主頁“顯示登錄彈出窗口”和“顯示注冊彈出窗口”，它可以在主頁上彈出2個窗口。 那兩個彈出窗口是主頁中的div。 我將這3個html分開，因為我希望登錄名和注冊名可以在任何頁面上顯示為彈出框。

這是我的問題：在登錄彈出頁面中，我也有一個相同的“顯示注冊彈出窗口”按鈕。 我要這樣做，當我單擊按鈕時，它可以隱藏登錄彈出窗口（主頁中的div）和主頁上的“顯示注冊彈出窗口”。 我該怎么辦？

這是我的代碼示例：

主頁

 <!DOCTYPE>
<html>
<head>
<title>Home page</title>
<meta charset="UTF-8">
<script src="testjs.js"></script>

</head>

<body>
    <button id="login" onclick="goto_login()">goto login</button>
    <button id="register" onclick="goto_register()">goto register</button>
    <div id="loginPopup" style ="background-color:red; display:none;">
        <object id="login_location" type="text/html" data="login.html"
            style="width:100%; height:50%;">
        </object>
    </div>

    <div id="registerPopup" style="background-color: yellow; display:none;">
         <object id="login_location" type="text/html" data="regi.html"
            style="width:100%; height:50%;">
        </object>
    </div>
</body>
</html>

登錄彈出

<html>
<head><script src="testjs.js"></script></head>
<body>

    <input id="id" type="text">
    <input id="pw" type="text">

    <input id="login" type="button" value="login">

    <input id="goto_register" onclick="goto_register()" type="button" value="goto-register">
</body>
</html>

注冊彈出窗口

<html>
<head><script src="testjs.js"></script></head>
<body>

    <input id="id" type="text">
    <input id="pw" type="text">


    <input id="register" onclick="goto_register()" type="button" value="register">
</body>
</html>

的JavaScript

function goto_login() {
var loginPopup  =  document.getElementById("loginPopup");
var registerPopup = document.getElementById("registerPopup");

loginPopup.style.display="block";
registerPopup.style.display="none";
}

function goto_register() {
var loginPopup  = document.getElementById("loginPopup");
var registerPopup = document.getElementById("registerPopup");

loginPopup.style.display="none";
registerPopup.style.display="block";
}

function close_pop() {
var loginPopup  = document.getElementById("loginPopup");
var registerPopup = document.getElementById("registerPopup");

loginPopup.style.display="none";
registerPopup.style.display="none";
}

Answer 1

為了簡單起見，我將高度設置為px值，並刪除了<object>標簽。 我的猜測是您的對象標記出了點問題，我沒有用它來導入html。

 function goto_login() { var loginPopup = document.getElementById("loginPopup"); var registerPopup = document.getElementById("registerPopup"); loginPopup.style.display = "block"; registerPopup.style.display = "none"; } function goto_register() { var loginPopup = document.getElementById("loginPopup"); var registerPopup = document.getElementById("registerPopup"); loginPopup.style.display = "none"; registerPopup.style.display = "block"; } function close_pop() { var loginPopup = document.getElementById("loginPopup"); var registerPopup = document.getElementById("registerPopup"); loginPopup.style.display = "none"; registerPopup.style.display = "none"; }

 <button id="login" onclick="goto_login()">goto login</button> <button id="register" onclick="goto_register()">goto register</button> <div id="loginPopup" style="background-color:red; display:none;width:100%; height:300px;"> <input id="id" type="text"> <input id="pw" type="text"> <input id="login" type="button" value="login"> <input id="goto_register" onclick="goto_register()" type="button" value="goto-register"> </div> <div id="registerPopup" style="background-color: yellow; display:none;width:100%; height:300px;"> <input id="id" type="text"> <input id="pw" type="text"> <input id="register" onclick="goto_register()" type="button" value="register"> </div>

如何通過單擊另一個html頁面上的按鈕來編輯頁面？

問題描述

1 個解決方案

解決方案1
0 2016-12-19 21:30:14

如何通過單擊另一個html頁面上的按鈕來編輯頁面？

問題描述

1 個解決方案

解決方案1 0 2016-12-19 21:30:14

解決方案1
0 2016-12-19 21:30:14