如何使用iframe达到post提交的效果

对iframe中的页面使用post提交。
       假设是如下的一个页面:


<a href="javascript:void(0)" id="aa" >生成页面</a>
<iframe src="" id="_iframe" width="100%" frameborder="0" scrolling="auto"></iframe>
<script type="text/javascript"> 
$('#aa').click(function(){
           $('#_iframe').src = "helloworld/index.php";
});
</script>


       点击页面中”生成页面“的那个连接,iframe就会引用那个叫helloworld/index.php页面了。
       从中我们不难看出,可以通过在src引用的url后面追加一些querystring来将参数带入到页面中,从而实现不同的页面逻辑。但是这里存在一个问题,那就是,如果我们不希望所带的参数通过get请求提交到页面中,或者,我们需要携带的参数过多,过长的时候,用以上的方法就不合适了。
       解决方法也非常简单:改一下按钮的click事件对应的函数,使用ajax提交数据到页面的地址,返回数据格式设为html,并将其展示在iframe中。具体代码如下:


<script type="text/javascript"> 
var data=xxxx;
$('#aa').click(function(){
    $.ajax(
         type : 'post',
         url : "helloworld/index.php"
         dataType : html
         success : function(html_content){
                 $("#_iframe").contents().find("html").html(html_content);
         }    
    );
});
</script>


      这样,我们就实现了需要的功能。

转载自:轩辕随风的博客
http://blog.sina.com.cn/u/1739592265 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值