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

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

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

高分求教：关于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. javascript的对象的步骤
  2. extjs引见
  3. 3D模型导入 CanvasMatrix.js发动机 demo(一)
  4. jsp中request.getParameter()中文乱码解决例证
  5. yii_wiki_394_javascript-and-ajax-with-yii （在yii 中使用 javascript 跟ajax）
  6. ext4.1 spket 1.6.23 Myeclipse10.5 开发环境 extjs代码揭示
  7. js数目字比较大小
  8. 缺少')'的有关问题
  9. javascript实现对键盘下面tab和enter的控制