网页内嵌html遇到的问题

在项目中遇到个问题

充值功能是点击一个按钮这个按钮会弹出模态框，输入充值金额会执行一段脚本自动提交数据到https://openapi.alipay.com/gateway.do上

结果：本网页跳转到支付界面

需求：点击充值按钮弹出窗口内嵌支付页面

思路：在弹窗确定后弹出一个窗口放支付界面

遇到的问题

1.由于原来的方法是获取一段

表单的字符串并自动提交所以会跳转页面

解决方法：1.添加模态框相应标签，里面加上iframe标签，给iframe标签添加name属性,2.获取form表单在form里添加target=“指向iframe的name”

2.把字符串（form表单及script脚本）添加进iframe里。

出现的新问题：在关闭模态框后原本的样式发生了变化。

原因：由于连续打开关闭模态框会有一个body增加样式"padding-right:17px"

解决方法：

隐藏父类模态框后延迟一段时间再打开新的模态框
$('#modal1 ').modal('hide');
　　setTimeout(function(){
　　$('#modal2 ').modal('show'); 
},320);

 

参考：https://blog.csdn.net/youtao271/article/details/82251943