谷歌showModalDialog()方法不兼容出现对话窗口的解决办法


Posted in Javascript onFebruary 15, 2016

showModalDialog,在测试中,IE,Firefox中正常运行,但是在google中,点击后没什么反应,在网上看了一下,谷歌浏览器不支持showModalDialog模态对话框和无法返回returnValue,得到了一个解决办法

<script type="text/javascript">
//开启模式窗口
function showMyModal() {
var url = "SelectUser.aspx";
//传入参数示例
var modalReturnValue = myShowModalDialog(url, window, 300, 500);
//alert(modalReturnValue.name);
//窗口关闭后执行某些方法
//TODO sth
}
//弹出框google Chrome执行的是open
function myShowModalDialog(url, args, width, height) {
var tempReturnValue;
if (navigator.userAgent.indexOf("Chrome") > 0) {
var paramsChrome = 'height=' + height + ', width=' + width + ', top=' + (((window.screen.height - height) / 2) - 50) +
',left=' + ((window.screen.width - width) / 2) + ',toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no';
window.open(url, "newwindow", paramsChrome);
}
else {
var params = 'dialogWidth:' + width + 'px;dialogHeight:' + height + 'px;status:no;dialogLeft:'
+ ((window.screen.width - width) / 2) + 'px;dialogTop:' + (((window.screen.height - height) / 2) - 50) + 'px;';
tempReturnValue = window.showModalDialog(url, args, params);
}
return tempReturnValue;
}
</script>

最后想要点击就可以出现对话框就行,只需要使用onclick事件进行调用方法就行

以上给大家介绍了谷歌showModalDialog()方法不兼容出现对话窗口的问题分析及解决办法,希望对大家有所帮助。

Javascript 相关文章推荐
js querySelector和getElementById通过id获取元素的区别
Apr 20 Javascript
js实现倒计时(距离结束还有)示例代码
Jul 24 Javascript
js向上无缝滚动,网站公告效果 具体代码
Nov 18 Javascript
几行js代码实现自适应
Feb 24 Javascript
基于VUE选择上传图片并页面显示(图片可删除)
May 25 Javascript
实时监控input框,实现输入框与下拉框联动的实例
Jan 23 Javascript
vue引入新版 vue-awesome-swiper插件填坑问题
Jan 25 Javascript
Angular5.0 子组件通过service传递值给父组件的方法
Jul 13 Javascript
JS 验证码功能的三种实现方式
Nov 26 Javascript
Nuxt项目支持eslint+pritter+typescript的实现
May 20 Javascript
WebStorm中如何将自己的代码上传到github示例详解
Oct 28 Javascript
Vue + ts实现轮播插件的示例
Nov 10 Javascript
仅30行代码实现Javascript中的MVC
Feb 15 #Javascript
理解javascript中的with关键字
Feb 15 #Javascript
使用基于Node.js的构建工具Grunt来发布ASP.NET MVC项目
Feb 15 #Javascript
JavaScript模版引擎的基本实现方法浅析
Feb 15 #Javascript
在ASP.NET MVC项目中使用RequireJS库的用法示例
Feb 15 #Javascript
一道常被人轻视的web前端常见面试题(JS)
Feb 15 #Javascript
获取阴历(农历)和当前日期的js代码
Feb 15 #Javascript
You might like
使用Linux五年积累的一些经验技巧
2013/06/20 PHP
php实现统计目录文件大小的函数
2015/12/25 PHP
PHP+MySQL统计该库中每个表的记录数并按递减顺序排列的方法
2016/02/15 PHP
PHP实现使用DOM将XML数据存入数组的方法示例
2017/09/27 PHP
基于PHP-FPM进程池探秘
2017/10/17 PHP
Laravel框架验证码类用法实例分析
2019/09/11 PHP
PHP 多进程与信号中断实现多任务常驻内存管理实例方法
2019/10/04 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
鼠标滚轮控制网页横向移动实现思路
2013/03/22 Javascript
jquery实现图片渐变切换兼容ie6/Chrome/Firefox
2013/08/02 Javascript
ExtJS的拖拽效果示例
2013/12/09 Javascript
jquery选择器需要注意的问题
2014/11/26 Javascript
js实现网站最上边可关闭的浮动广告条代码
2015/09/04 Javascript
移动端 一个简单易懂的弹出框
2016/07/06 Javascript
Angular2 组件通信的实例代码
2017/06/23 Javascript
Node.js  REPL (交互式解释器)实例详解
2017/08/06 Javascript
200行HTML+JavaScript实现年会抽奖程序
2019/01/22 Javascript
微信二次分享报错invalid signature问题及解决方法
2019/04/01 Javascript
浅谈element中InfiniteScroll按需引入的一点注意事项
2020/06/05 Javascript
Python利用IPython提高开发效率
2016/08/10 Python
window下eclipse安装python插件教程
2017/04/24 Python
python解决js文件utf-8编码乱码问题(推荐)
2018/05/02 Python
在OpenCV里使用特征匹配和单映射变换的代码详解
2019/10/23 Python
Python:type、object、class与内置类型实例
2019/12/25 Python
Python通过正则库爬取淘宝商品信息代码实例
2020/03/02 Python
Python日志:自定义输出字段 json格式输出方式
2020/04/27 Python
伦敦高达60%折扣的钻石珠宝商:Purely Diamonds
2018/06/24 全球购物
泰国网上购物:Shopee泰国
2018/09/14 全球购物
介绍一下.net和Java的特点和区别
2012/09/26 面试题
房产销售经理职责
2013/12/20 职场文书
学习自我鉴定
2014/02/01 职场文书
优秀电子工程系毕业生求职信
2014/05/24 职场文书
员工辞职信范文大全
2015/05/12 职场文书
环保建议书作文400字
2015/09/14 职场文书
JavaScript ES6的函数拓展
2022/01/18 Javascript
使用CSS自定义属性实现骨架屏效果
2022/06/21 HTML / CSS