在项目中遇到个问题

充值功能是点击一个按钮这个按钮会弹出模态框,输入充值金额会执行一段脚本自动提交数据到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. WPF使用Font-Awesome字体

    官方网站:https://fontawesome.com/ 使用教程: 学习WPF——使用Font-Awesome图标字体 - liulun - 博客园https://www.cnblogs.com/ ...

  2. 卸载win10内置windows app的方法

    原文:卸载win10内置windows app的方法 2015年,微软推出了windows10操作系统,其以漂亮的界面.良好的操作方式.方便的推送升级迅速获得了好多人的好评,因此,好多同学都换了win ...

  3. 三种扩展 Office 软件功能的开发模型对比 – Office Add-In Model, VBA 和 VSTO

    当 Office 用户需要针对文档自定义新功能时,可以求助于 VBA 或者 VSTO 两种方式.Office 2013 富客户端以后,微软为 Office 平台上的开发者提供了一种新模型 --- Of ...

  4. Windows10中的IIS10安装php manager

    Windows10中自带的IIS:Microsoft-IIS/10.0. 然后这个10却让原本支持组件无法安装了,php manager组件安装时提示“必须安装IIS7以上才可以安装”. 那是不是真的 ...

  5. Android-小小设置永久解决程序因为未捕获异常而异常终止的问题

    (一) 前言各位亲爱的午饭童鞋,是不是经常因为自己的程序中出现未层捕获的异常导致程序异常终止而痛苦不已?嗯,是的.. 但是,大家不要怕,今天给大家分享一个东东可以解决大家这种困扰,吼吼! (二) Un ...

  6. 基于python实现的三方组件----Celery

    一.基于python实现的三方组件----Celery 1.作用 用于异步周期任务的处理 2.Celery的组成 (1)任务 app (2)记录任务的缓存(通常用redis或rabbitMQ) 任务记 ...

  7. 深入理解ES6 - var-let-const

    知识点 var 声明变量: 1.存在变量提升,实际上var无论在哪里声明,都会被当做当前的作用域顶部声明变量. 2.可以重复声明,后声明的变量会覆盖前声明的变量. let 声明变量: 1.不存在变量提 ...

  8. MySQL如何转SQL server

    MySql的数据如何导入到Sql Server数据库中?(转载)   本文咱讨论的重点是如何将MySql数据导入到Sql Server数据库中,所以就需要机器上同时安装了MySql和Sql Serve ...

  9. 【python3两小时快速入门】入门笔记01:基础

    又要我搞爬虫了,这次的源网站使用的ajax加载数据,我用java爬下来的页面内容部分全都是空,虽然java也有插件,但是使用起来感觉很麻烦,所以,python!老子来了.    1. 版本:pytho ...

  10. 【需要重新整理】【mongoDB】mongoDB初见笔记

    A安装(windows版): 1.官网下载安装文件 2.解压 3.配置环境变量 4.win+r cmd>打开控制台配置仓库路径 5.mongod --dbpath=d:/bigMongo//启动 ...