javascript:如何在弹出窗口中编写 [英] javascript : How to write inside popup window
本文介绍了javascript:如何在弹出窗口中编写的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我创建了一个JavaScript程序，并创建了电影对象，并创建了一个名为myWin的新窗口，在myWin中，我还创建了另一个名为actorWin的窗口.现在，当我单击单击此处访问演员窗口"时，我想在actorWin中传递url(myMovie.actor)和description(myMovie.website_actor).我尝试了下面的方法，但是不起作用.谁能建议我如何在actorWin弹出窗口中编写代码.
I have created one javascript program and I have created movie object and I have created new window called myWin and inside myWin I have created another window called actorWin. Now I want to pass url(myMovie.actor) and description(myMovie.website_actor) inside actorWin when I click on CLICK HERE TO ACCESS TO THE ACTOR WINDOW. I have tried below method but that is not working. Can anyone suggest me how to write inside actorWin popup window .
代码:
<!DOCTYPE html>
<html>
<head>
<title>lab 8</title>
<script type="text/javascript">
var myWin = window.open("", "myWin", "height=500, width=500,location,menubar,toolbar,status,resizable");
function movie(movie_title, website_title, actor, website_actor){
this.movie_title = movie_title;
this.website_title = website_title;
this.actor = actor;
this.website_actor = website_actor;
}
var myMovie = new movie("Before she was Wonder Woman, she was Diana, princess of the Amazons, trained to be an unconquerable warrior. Raised on a sheltered island paradise, Diana meets an American pilot (Chris Pine) who tells her about the massive conflict that's raging in the outside world. Convinced that she can stop the threat, Diana leaves her home for the first time. Fighting alongside men in a war to end all wars, she finally discovers her full powers and true destiny.",
"http://www.imdb.com/title/tt0451279/",
"Gal Gadot is an Israeli actress, singer, martial artist, and model. She was born in Rosh Ha'ayin, Israel, to an Ashkenazi Jewish family. Her parents are Irit, a teacher, and Michael, an engineer, who is a sixth-generation Israeli. She served in the IDF for two years, and won the Miss Israel title in 2004.",
"http://www.imdb.com/name/nm2933757/?ref_=tt_cl_t1");
myWin.document.write(
"<script type='text/javascript'>"
+ "function movieWindow() {"
+ "var movieWin = window.open(\"" + myMovie.website_title + "\" , \"movieWin\", \"height=500, width=500,location,menubar,toolbar,status,resizable\");"
+ "}"
+ "function closeMovie() {"
+ "movieWin.close()"
+ "}"
+ "<\/script>");
myWin.document.write(
"<script type='text/javascript'>"
+ "function actorWindow() {"
+ "var actorWin = window.open(\"''\" , \"actorWin\", \"height=500, width=500,location,menubar,toolbar,status,resizable\");"
+ "<p style='color: green; font-size: 150%'> \""+ myMovie.actor + "\" </p>"
+ "<a style='color: pink; font-size: 150%' href= \""+myMovie.website_actor +"\"> Click for more info </a> "
+ "}"
+ "<\/script>");
myWin.document.write(
+"<script type='text/javascript'>"
+ "<body style='background-image : url(lab8_images/back.png)'>"
+ "<h1 style= 'text-align: center; color: white; font-family: monospace; font-size: 200%'> What about this movie? </h1>"
+ '<br/>' + '<br/>' +'<br/>'
+ "<p style = 'font-family: monospace; font-size: 150%; color: #ffffff; padding: 0px 15px: 0px 15px; text-decoration: none'> \""+ myMovie.movie_title +"\" </p>"
+ "<p style = 'font-family: monospace; font-size: 150%; color: #ffffff; text-align:center; text-decoration: none'> <a style='color:white' href = 'javascript: movieWindow()' > CLICK HERE TO ACCESS TO THE MOVIE WINDOW </a><br></p>"
+ "<p style = 'font-family: monospace;font-size: 150%; color: #ffffff; text-align: center; text-decoration: none'> <a style='color:white' href = 'javascript: actorWindow()'> CLICK HERE TO ACCESS TO THE ACTOR WINDOW </a><br></p>"
+ "<p style = 'font-family: monospace; color: white; text-align: center; text-decoration: none; font-size: 150%'> <a style='color:white' href = 'javascript: closeMovie();'> CLICK HERE TO CLOSE THE MOVIE WINDOW </a><br></p>"
+ "<p style = 'font-family: monospace; color: white; text-align: center; text-decoration: none; font-size: 150%'><a style='color:white' href='javascript:actorWindow.close();'> CLICK HERE TO CLOSE THE ACTOR WINDOW </a><br></p>"
+ "<p style = 'font-family: monospace; color: white; text-align: center; text-decoration: none; font-size: 150%'><a style='color:white' href='javascript:window.close();'> CLICK HERE TO CLOSE THIS WINDOW </a><br></p>"
+" <\/script>"
);
</script>
</head>
<body background = lab8_images/back.png>
</body>
</html>
输出:
https://i.stack.imgur.com/xbPIL.jpg
推荐答案
您可以使用 window.opener 和 postMessage()在浏览上下文之间进行通信
You can use window.opener and postMessage() to communicate between browsing contexts
使用初始HTML
<script>
let outerWindow = window.open("myWin.html", "_blank");
window.onmessage = function(e) {
console.log(e.data);
// pass data to inner window
e.source.postMessage(JSON.stringify({a:1, b:2}), document.origin);
}
<script>
在"actorWin" HTML上
at "actorWin" HTML
<script>
window.onmessage = function(e) {
console.log(e.data); // message from `window` at initial HTML `document`
}
window.opener.opener.postMessage("inner message", document.origin);
</script>
plnkr http://plnkr.co/edit/99cHuMklH9S9d4Rgf73K?p=info
这篇关于javascript:如何在弹出窗口中编写的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
