in javascript open popup with href link
Question
when I view this codes, iframe popup automatically open. but I want to open iframe when I click "click me" button. could you please help me? I hope that its very easy trick but I am an amateur for javascript.
<html>
<head>
<script language="javascript">
var iframe = '<html><head><style>body, html {width: 100%; height: 100%; margin: 0; padding: 0}</style></head><body><iframe src="http://www.euronews.com" style="height:calc(100% - 4px);width:calc(100% - 4px)"></iframe></html></body>';
var win = window.open("","","width=1024,height=768,toolbar=no,menubar=no,resizable=yes");
win.document.write(iframe);
</script>
<head>
<body>
<a href="javascript:load();"><b><font color="000">Click Me !</font></b></a>
</body>
</html>
2 answers
solution1
1 ACCPTED 2021-05-10 20:34:03
I have fixed your code for you. You should probably not use an inline call, but here is how you would do it. Make sure to wrap your code in the load function so when you call javascript:load() it will complete the function.
<html>
<head>
<script language="javascript">
function load() {
var iframe = '<html><head><style>body, html {width: 100%; height: 100%; margin: 0; padding: 0}</style></head><body><iframe src="http://www.euronews.com" style="height:calc(100% - 4px);width:calc(100% - 4px)"></iframe></html></body>';
var win = window.open("","","width=1024,height=768,toolbar=no,menubar=no,resizable=yes");
win.document.write(iframe);
}
</script>
</head>
<body>
<a href="javascript:load();"><b><font color="000">Click Me !</font></b></a>
</body>
</html>
solution2
1 2021-05-10 20:36:11
A solution could just be not creating the Iframe until the button is clicked:
<html>
<head>
<script language="javascript">
function load() {
var iframe = '<html><head><style>body, html {width: 100%; height: 100%; margin: 0; padding: 0}</style></head><body><iframe src="http://www.euronews.com" style="height:calc(100% - 4px);width:calc(100% - 4px)"></iframe></html></body>';
var win = window.open("","","width=1024,height=768,toolbar=no,menubar=no,resizable=yes");
win.document.write(iframe);
}
</script>
</head><body>
<a href="javascript:load();"><b><font color="000">Click Me !</font></b></a></body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.