在项目中遇到个问题

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

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

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

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

遇到的问题

1.由于原来的方法是获取一段<form>表单的字符串并自动提交所以会跳转页面

解决方法: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

网页内嵌html遇到的问题的更多相关文章

  1. HTML-图片热点、网页内嵌、网页拼接、快速切图

    图片热点 规划出图片上的一个区域,可以做出超链接,直接点击图片区域就可以完成跳转的效果.与图片链接不同,热点是图片上的某一个区域或多个区域. 我们用魔兽世界图片来做一个图片热点,点击logo.区域和不 ...

  2. 浅谈html5网页内嵌视频

    更好的阅读体验:浅谈html5网页内嵌视频 如今在这个特殊的时代下:flash将死未死,微软和IE的历史问题,html5标准未定,苹果和谷歌的闭源和开源之争,移动互联网的大势所趋,浏览器各自为战... ...

  3. django2 用iframe标签完成 网页内嵌播放b站视频功能

    前言: 给自己的网站中加入视频资源,有两种方法,一种是用iframe标签引用外站资源,另一种则使用video标签,获取站内资源进行视频播放.其中前者顾名思义,是将视频资源上传到视频网站中,然后通过引用 ...

  4. 如何解决Angular网页内嵌推特时间线无法正常显示

    我最近解决了一个折磨了我好久但是解决方法却只是添加两三行代码的问题.我没有在网上找到合适的解决方案,最后是我根据官方网站和很多的帖子里的部分代码得到的启发,尝试了很久之后得到的解决方法.因为过程实在是 ...

  5. ios平台appstore不支持网页内嵌app解决方案

    苹果一直拒绝 UIWebView 内嵌 HTML5 页面的 iPhone.iPad APP应用上架到 App Store,建议这样的APP去做成Safari的Web应用.但是,苹果的审核人员只从界面. ...

  6. 【转】浅谈html5网页内嵌视频

    转自 http://www.pchou.info/web/2014/01/30/52ea01e13a7f1.html

  7. PluginOK中间件高级版-支持在Chrome、Edge、Firefox等浏览器网页中真正内嵌ActiveX等控件运行的版本已获多家上市公司采购

    PluginOK(牛插)中间件(原名:本网通WebRunLocal)是一个实现WEB浏览器(Web Browser)与本地程序(Local Application)之间进行双向调用的低成本.强兼容.安 ...

  8. form表单以及内嵌框架标签

    今关于今天所学习的东西又复杂又简单,上午学习了form表单,也是挺简单的:搭配table表格使用也是非常熟练. 下午讲了讲给网页内嵌框架标签以及在内嵌框架标签中添加其他的网页:还有在内嵌框架标签中添加 ...

  9. Selenium入门7 内嵌框架iframe

    如果网页内嵌iframe,那么iframe里的元素是无法直接定位的,需要使用switch_to.frame进入frame操作: 之后需要再操作页面上非嵌入在iframe里的元素,需要使用switch_ ...

随机推荐

  1. 微信小程序把玩(十九)radio组件

    原文:微信小程序把玩(十九)radio组件 radio组件为单选组件与radio-group组合使用,使用方式和checkbox没啥区别 主要属性: wxml <!--设置监听器,当点击radi ...

  2. Android零基础入门第4节:正确安装和配置JDK, 高富帅养成第一招

    原文:Android零基础入门第4节:正确安装和配置JDK, 高富帅养成第一招 在前几期中总结分享了Android的前世今生.Android 系统架构和应用组件那些事.带你一起来聊一聊Android开 ...

  3. delphi 实现微信开发(1) (使用kbmmw web server)

    原文地址:delphi 实现微信开发(1)作者:红鱼儿 大体思路: 1.用户向服务号发消息,(这里可以是个菜单项,也可以是一个关键词,如:注册会员.) 2.kbmmw web server收到消息,生 ...

  4. Win7和Vista的安全机制对于应用程序读取配置文件相关操作的影响(虚拟重定向技术)

    今天构造了一个新版本的XXXX软件,并且在纯净的系统下进行了较为全面的测试.测试中也发现了一些问题.其中包括在Win7测试时程序竟然在另一个目录中创建了文件夹和配置文件,并且进行相关读取操作,却并没有 ...

  5. Elasticsearch 6.1.2 搭建及使用教程一

    安装包: es6.1.2 es-head 开发环境:jdk 1.8 搭建流程一一说明: 将下载好的es解压后找到如下图文件 打开后如下图所示配置(已添加详细注释): # 集群的名字 cluster.n ...

  6. 使用Arcgis Api for Javascript 调用 本地Portal发布的WebMap

    1.环境搭建 安装Arcgis Portal 10.4,Server 10.4,DataStore ,WebAdaptor for IIS,搭建arcgis api for javascript 4. ...

  7. javaweb各种框架组合案例(三):maven+spring+springMVC+hibernate

    1.hibernate译为"越冬",指的是给java程序员带来春天,因为java程序员无需再关心各种sql了: 2.hibernate通过java类生成数据库表,通过操作对象来映射 ...

  8. 学习过程中遇到的python内置函数,后续遇到会继续补充进去

    1.python内置函数isinstance(数字,数字类型),判断一个数字的数字类型(int,float,comple).是,返回True,否,返回False2.python内置函数id()可以查看 ...

  9. spring cloud 系列第6篇 —— zuul 服务网关 (F版本)

    源码Gitub地址:https://github.com/heibaiying/spring-samples-for-all 一.zuul简介 1.1 API 网关 api 网关是整个微服务系统的门面 ...

  10. 【设计模式】行为型01策略模式(strategy patten)

    学设计模式一段时间了,有些懂了,有些半知半解,通过写笔记博客的方式总结一下: 关于策略模式,我的个人理解就是将一些经常变动的算法独立抽取出来,可以是一个方法,也可以是一个策略类,这样,如果有需求变更, ...