1. 爱易网页
  2. JavaSript
  3. ：关于iframe和父窗口之间传递数据的有关问题

：关于iframe和父窗口之间传递数据的有关问题

日期：2014-05-16　 浏览次数：20570 次

高分求教：关于iframe和父窗口之间传递数据的问题
问题是这样，下面的代码是我的主页面，主页面里面有个搜索框，然后就是一个iframe

我现在想实现如下两个功能：
1.把主页面中的搜索框中的数据传递到iframe里面
2.然后返回的结果，从iframe中返回到主页面当中（或者在主页面当中再建立一个iframe，返回给它也行）

我写的代码如下，下面代码中“XXXXX”应该是要写的东西，本人新手，搞不定阿

PS:大侠们最好给出具体代码，小弟才疏学浅能力有限！

<html>
<head><title>wlw.com</title></head>
<body>
<form action = "#" onsubmit = "XXXXXX" style = "display: inline-block; white-space: nowrap;" id = "searchForm">
  <table cellspacing = "0" cellpadding = "0">
  <tr>
  <td>
  <input id = "strInput" type = "text" style = "width: 400px; height: 30px;">
  </td>
  <td>
  <button type = "submit" id = "searchButton" style = "width:90px; height: 30px;"></button>
  </td>
 </tr>

  </table>
</form>

<hr>

<iframe name="inside" src="index-clear.html" cols="30%,*" height=600 width=1100 align=right scrolling=no frameborder=yes>
</iframe>


</body>
</html>


------解决方案--------------------
HTML code
<html>
<head><title>wlw.com</title>
<script type="text/javascript">
function XXXXXX(){
    document.inside.window.document.body.innerHTML=document.getElementById("strInput").value;
    document.inside.window.onresize=function(){parent.window.document.getElementById("strInput").value="return value"};
    document.inside.window.resizeTo(1100,500);
}
</script>
</head>
<body>
<form action = "#" onsubmit = "XXXXXX();return false;" style = "display: inline-block; white-space: nowrap;" id = "searchForm">
  <table cellspacing = "0" cellpadding = "0">
  <tr>
  <td>
  <input id = "strInput" type = "text" style = "width: 400px; height: 30px;">
  </td>
  <td>
  <button type = "submit" id = "searchButton" style = "width:90px; height: 30px;"></button>
  </td>
 </tr>

  </table>
</form>

<hr>

<iframe name="inside" src="photo3.aspx" cols="30%,*" height=600 width=1100 align=right scrolling=no frameborder=yes>
</iframe>


</body>
</html>

------解决方案--------------------

main.html
HTML code
<html>
    <head>
        <script type="text/javascript">
            function getMsg(){
                var el = document.getElementById("msg");
                var txt = document.frames['inside'].document.getElementById('txts');
                txt.value = el.value;
            }
        </script>
    </head>
    <body>
        <input type="text" id="msg" />
        <input type="button" onclick="getMsg()" value="button" /><br/>
        <iframe name="inside" id="inside" src="1.html" cols="30%,*" height=600 width=1100 align=right scrolling=no frameborder=yes>
        </iframe>
    </body>
</html>

------解决方案--------------------


HTML code

<html>
<head><title>wlw.com</title></head>
<script type="text/javascript">
var theFormSubmit=function(){
    searchForm.action = "index-clear.html?s=&quo

相关资料更多>

  1. EXTJS中Ext.grid.Panel依据行号设置颜色
  2. 浅谈 javascript 对象的沿袭方法
  3. 这个变量是什么类型的。下面该怎么理解
  4. 急怎么php用js实现联动时间选择框
  5. 如果有多个window.onscroll=function(){｝怎么办
  6. 关于事件冒泡的有关问题
  7. extjs 饼图不出效果！该如何处理
  8. 嘿牛软件工程师_成都传智博客_javascript的注册表单验证、提交有关问题
  9. js好手的作品