在用IFrame做Ajax时，需要考虑的有：

  • 先定义隐藏的IFrame
1
<iframe name="myIframe" src="blank.html" style="width:0px;height:0px" frameborder="0"> </iframe>

  • 通过button,Href或者form提交，动态修改IFrame的src属性或者设置Href,Form的Target属性

  • 如何在父窗口和IFrame页面传递数据

Three ways of Moving Data From an iframe to the Parent

  • The iframe page can use it’s own javascripts to transfer and place the data into the parent.
1
2
3
4
5
<script>
     // - this is the script in the iframe results page 
    var reps = document.getElementById('state_reps').innerHTML; 
    parent.document.getElementById('results1').innerHTML = reps; 
</script>    
  • The iframe page can pass its document object as an argument to a function in the parent, thereby allowing the parent to retrieve data from the iframe.
1
2
3
4
5
6
7
  <script> 
    // - this is the script in parent page 
    function showReps(doc){ 
        var x = doc.getElementById('state_reps').innerHTML; 
        document.getElementById('results2').innerHTML = x; 
    } 
</script>    
  • Place an onload event handler in the iframe tag in the parent document (this page). This method does not work with Netscape
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<iframe name="repIframe3" src="blank.html" onload="getIframeDoc()"></iframe>
<script> 
    function getIframeDoc(){ 
        var iframeDoc = window.frames['repIframe3'].document; 
        var sr = iframeDoc.getElementById('state_reps'); 
        if (sr){ 
            var reps3 = sr.innerHTML; 
            document.getElementById('results3').innerHTML = reps3; 
        } 
    } 
</script>        
<script> 
    // - this is the script in the iframe results page 
    parent.showReps(document); 
</script>