javascript — передает данные на новую страницу и вызывает функцию js, передавая в качестве параметра отправленные данные.
Моя цель — открыть новую страницу и добавить некоторые данные в определенный div этой страницы с помощью javascript, используя некоторые данные, отправленные с первой страницы.
Код довольно прост, но я также попытаюсь объяснить, что он делает:
Я пытался добиться этого, вызывая функцию JS show_img(x) когда пользователь нажимает на элемент div, передавая ему параметр, указанный в этом элементе div (то есть «art12»), который я хочу передать на следующую страницу. В show_img () я открываю новое окно с window.open() а потом я вызываю функцию fill_page() который существует в этом окне и передается ему в качестве параметра («art12»). В fill_page(x) я хочу добавить некоторые данные к определенному div открытой страницы, какие данные я получу, используя ajax и передавая в качестве данных «art12». Я пытался просто добавить данные к тому div в функции, которую я назвал на первой странице show_img(x) без вызова функции открытой страницы, но ничего не добавляется.
Какой самый эффективный способ добиться этого?
index.php
<div class="img_mid" onclick="show_img('art11');">
</div>
<div class="img_mid" onclick="show_img('art12');">
</div>
<div class="img_mid" onclick="show_img('art13');">
</div>
show_image.js
function show_img(x)
{
var temp = window.open("img_page.php","_self");
$(temp.document).load(function()
{
fill_page(x); //functon in js file that is declared in img_page.php
});
}
img_page.php выглядит примерно так, а функция fill_page (x) находится внутри fill.js
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/main.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="js/fill.js"></script>
</head>
<body>
<header>
content
content
</header>
<div id="div_to_append_content_to">
</div>
</body>
fill.js
function fill_page(x)
{
//will use x to to get content from database using ajax
var textToInsert = [];
textToInsert[0] = 'content';
textToInsert[1] = 'more content';
textToInsert[2] = 'some more content';
$("#div_to_append_content_to").append(textToInsert.join(''));
}
Решение
Задача ещё не решена.
Другие решения
Других решений пока нет …