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

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

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

高分求教：关于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. js浮动层定位求问解决方法
  2. submit,该怎么解决
  3. JS中e的使用解决办法
  4. (转)用javascript动态整合iframe高度
  5. 百思不得其解，唯有靠这里的弟兄们了
  6. TDD测试驱动的javascript开发(二) - 深入学习javascript中prototype
  7. JS的时间判断有关问题
  8. 前台是个什么东西-JavaScript-鼠标事件
  9. js计算报表的值(例如购物车中)