How to pass value from parent to its iframe using javascript
Question
Hi i want to pass the value by calling the parent link page value to its iframe link page sample code is
<html>
<head>
<title>
</title>
<script>
function sendvalue(v){
alert(v);
}
</script>
</head>
<body>
<form id="f">
<input type="button" value="123" onclick="sendvalue(this.value)">
</form>
<iframe id="frame1" src="a.html" width="500px;"></iframe>
</body>
</html>
a.html
<html>
<head>
<title>
</title>
<script>
</script>
</head>
<body>
<h3> Frame</h3>
<form id="myform">
Req value <input type="text" name="a" id="a">
</form>
</body>
</html>
when i call sendvalue function then the value should pass to iframe link page in form for input field. how this can be achieved.
3 answers
solution1
2 2017-09-13 05:07:05
You can use postMessage in order to communicate between 2 iframe.
On the parent frame you need to grab the iframe's window with iframeEl.contentWindow.postMessage(value as a string, can be json.stringified value)
On the child frame you need to add event of type message , something like that:
window.addEventListener('message', function(dataPassed) {
//Your logic here.
})
For more info read that
solution2
0 2017-04-11 11:51:35
<html>
<head>
<title>
</title>
<script>
function sendvalue(v){
document.getElementById('va').value = v;
window.frames['framename'].document.getElementById("a").value = v
}
</script>
</head>
<body>
<form id="f">
<input type="button" value="123" onclick="sendvalue(this.value)">
<input type="text" name="va" id="va">
</form>
<iframe name="framename" src="a.html" width="500px;"></iframe>
</body>
</html>
a.html
<html>
<head>
<title>
</title>
</head>
<body>
<h3> Frame</h3>
<form id="myform">
Req value <input type="text" name="a" id="a">
</form>
</body>
</html>
solution3
0 2017-09-12 21:24:42
The Best way it to add to you Iframe
<iframe id="frame1" src="a.html?data=SomeData" width="500px;"></iframe>
and inside the iframe you can get the information by making varible
var MYDATA = location.href.split('=')[1].split('&');
(you will see that MYDATA=SomeData )
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.