В этой статье описывается метод передачи данных между окнами браузера JavaScript. Поделитесь этим для вашей ссылки. Конкретный анализ заключается в следующем:
краткое содержание:
В разработке проекта мы часто сталкиваемся с всплывающими окнами. Некоторые используют Div для моделирования всплывающих эффектов, некоторые используют iframes, а некоторые используют Windows, чтобы открыть новое окно через функцию Open, которая поставляется с окном. Сегодня я поделюсь с вами последним типом взаимодействия данных через функцию window.open (). Сначала посмотрите на визуализации:
принцип:
Данные, передаваемые в окно ребенка родительским окном, передаются через параметры URL, а данные, передаваемые в окно ребенка, родительское окно передаются через глобальную функцию родительского окна.
Код:
Index.html выглядит следующим образом:
Скопируйте код следующим образом: <! Doctype html>
<html lang = "en">
<голова>
<meta charset = "utf-8">
<title> документ </title>
</head>
<тело>
<div id = "content"> </div>
<button id = "test"> кнопка </button>
<Скрипт>
var test = document.getElementbyId ('test');
test.onclick = function () {
window.open ('./ window.html? param1 = name¶m2 = пароль', '_blank', 'width = 960, height = 650, menubar = no, noble bar = no, location = no, directories = no, status = no, scrollbars = yes, stogable = yes');
};
window.getContent = function (tx) {
document.getElementById ('content'). innerText = tx;
}
</script>
</body>
</html>
window.html выглядит следующим образом:
Скопируйте код следующим образом: <! Doctype html>
<html lang = "en">
<голова>
<meta charset = "utf-8">
<title> документ </title>
</head>
<тело>
<div id = "content"> </div>
<select name = "" id = "city">
<опция значение = "Шанхай"> Шанхай </option>
<option value = "Hangzhou"> Hangzhou </option>
</select>
<Скрипт>
var params = location.href.substring (location.href.lastIndexof ('?')+1) .split ('&');
document.getElementbyId ('content'). innerText = params;
var city = document.getelementbyid ('city');
city.onchange = function () {
window.opener.getContent (City.value);
}
</script>
</body>
</html>
Примечание: здесь есть сервисная среда
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.