Как отредактировать страницу, нажав кнопку на другой странице html?

Например, у меня есть домашняя страница с 2 кнопками «show login popup» и «show register popup», и на главной странице может отображаться 2 окна. Эти 2 всплывающих окна являются разделами на главной странице. Я сохраняю эти 3 html отдельно, потому что я хочу, чтобы регистрация и регистрация показывались на любых страницах в виде всплывающего окна.Как отредактировать страницу, нажав кнопку на другой странице html?

Вот моя проблема: у меня есть одна и та же всплывающая кнопка show register на всплывающей странице входа. Я хочу сделать это, когда я нажму кнопку, он может скрыть всплывающее окно входа (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>

Войти Popup

<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>

Регистрация Popup

<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"; 
}

источник

2016-12-19 kamil

Я установил высоту в значение 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>

источник

2016-12-19 21:30:14 Steve

Я думаю, что вы пропустите понять, я хочу яваскрипт функции, которая может редактировать эту страницу с другой страницы, например, у меня есть 3 HTML-страницы, страница А, ВХОД Всплывающая, ЗАРЕГИСТРИРУЙТЕСЬ POPUP. Оба POPUP могут отображаться на PAGE A, но у меня есть кнопка в LOGIN POPUP, называемая «go to register», которая может закрыть текущее всплывающее окно и открыть REGISTER POPUP на странице A. Надеюсь, вы поймете, что я говорю. sry, я не очень разбираюсь в объяснениях. – kamil

Как отредактировать страницу, нажав кнопку на другой странице html?

ответ

Смежные вопросы