首页 > 代码库 > js 自己项目中几种打开或弹出页面的方法
js 自己项目中几种打开或弹出页面的方法
自己项目中，几种打开或弹出页面的方法（部分需要特定环境下）
var blnTop = false;//是否在顶层显示 ///动态生成模态窗体（通过字符串生成） ///strModalId:模态窗体ID ///strTitle:模态窗体标题 ///strContent:模态窗体html字符串内容 ///strFooter:模态窗体右下方html字符串内容 ///intWidth:模态窗体的宽度 ///intHeight:模态窗体的高度 var ModeDialogContent = function (strModalId, strTitle, strContent, strFooter, intWidth, intHeight) { if (strModalId == null || strModalId == ‘‘) { abp.message.error("请指定对话框ID", "消息提示"); return; } var strStyle = ""; if (intWidth != null && intWidth != "") strStyle = "width:" + intWidth + "px;"; if (intHeight != null && intHeight != "") strStyle += "height:" + intHeight + "px"; if (strStyle != "") strStyle = " style=‘" + strStyle + "‘"; var strModalHtml = "<div class=‘modal fade‘ id=‘" + strModalId + "‘ tabindex=‘-1‘ aria-hidden=‘true‘ data-backdrop=‘static‘ role=‘dialog‘ aria-hidden=‘true‘>"; strModalHtml += "<div class=‘modal-dialog‘ " + strStyle + ">"; strModalHtml += "<div class=‘modal-content‘ " + strStyle + ">"; strModalHtml += "<div class=‘modal-header‘>"; strModalHtml += "<button type=‘button‘ class=‘close‘ data-dismiss=‘modal‘ aria-hidden=‘true‘>×</button>"; strModalHtml += "<h4 class=‘modal-title‘ >" + strTitle + "</h4></div>"; strModalHtml += "<div class=‘modal-body‘>" + strContent + "</div>"; strModalHtml += "<div class=‘modal-footer‘>"; strModalHtml += strFooter; strModalHtml += "<button type=‘button‘ class=‘btn btn-danger‘ data-dismiss=‘modal‘><i class=‘fa fa-times‘></i> 关闭</button>"; strModalHtml += "</div>"; strModalHtml += "</div>"; strModalHtml += "</div>"; strModalHtml += "</div>"; var objHtml = $(strModalHtml); objHtml.find(".modal-body").height($(strModalHtml).find(".modal-content").height() - 75);//设置URL地址的高度 //是否在顶层显示 if (blnTop) { $(strModalHtml).appendTo(window.top.$("body")); window.top.$("#" + strModalId).modal("show"); } else { $(strModalHtml).appendTo(this.$("body")); $("#" + strModalId).modal("show"); } } ///动态生成模态窗体顶层显示 ///strModalId:模态窗体ID ///strTitle:模态窗体标题 ///strContent:模态窗体html字符串内容 ///strFooter:模态窗体右下方html字符串内容 ///intWidth:模态窗体的宽度 ///intHeight:模态窗体的高度 var TopModeDialogContent = function (strModalId, strTitle, strContent, strFooter, intWidth, intHeight) { blnTop = true;//顶层显示 ModeDialogContent(strModalId, strTitle, strContent, strFooter, intWidth, intHeight); blnTop = false;//修改成默认值 } ///动态生成模态窗体（通过对像生成） ///strModalId:模态窗体ID ///strTitle:模态窗体标题 ///strContent:模态窗体对像内容 ///strFooter:模态窗体右下角对像内容 ///intWidth:模态窗体的宽度 ///intHeight:模态窗体的高度 var ModeDialogObjContent = function (strModalId, strTitle, objContent, objFooter, intWidth, intHeight) { if (strModalId == null || strModalId == ‘‘) { abp.message.error("请指定对话框ID", "消息提示"); return; } var strStyle = ""; if (intWidth != null && intWidth != "") strStyle = "width:" + intWidth + "px;"; if (intHeight != null && intHeight != "") strStyle += "height:" + intHeight + "px"; if (strStyle != "") strStyle = " style=‘" + strStyle + "‘"; var strModalHtml = "<div class=‘modal fade‘ id=‘" + strModalId + "‘ tabindex=‘-1‘ aria-hidden=‘true‘ data-backdrop=‘static‘ role=‘dialog‘ aria-labelledby=‘myModalLabel‘ aria-hidden=‘true‘>"; strModalHtml += "<div class=‘modal-dialog‘ " + strStyle + ">"; strModalHtml += "<div class=‘modal-content‘ " + strStyle + ">"; strModalHtml += "<div class=‘modal-header‘>"; strModalHtml += "<button type=‘button‘ class=‘close‘ data-dismiss=‘modal‘ aria-hidden=‘true‘>×</button>"; strModalHtml += "<h4 class=‘modal-title‘>" + strTitle + "</h4></div>"; strModalHtml += "<div class=‘modal-body‘></div>"; strModalHtml += "<div class=‘modal-footer‘>"; strModalHtml += "<button type=‘button‘ class=‘btn btn-default‘ data-dismiss=‘modal‘><i class=‘fa fa-times‘></i> 关闭</button>"; strModalHtml += "</div>"; strModalHtml += "</div>"; strModalHtml += "</div>"; strModalHtml += "</div>"; var objHtml = $(strModalHtml); objHtml.find(".modal-body").append(objContent); objHtml.find(".modal-footer").append(objFooter); objHtml.find(".modal-body").height($(strModalHtml).find(".modal-content").height() - 75);//设置URL地址的高度 //是否在顶层显示 if (blnTop) { $(objHtml).appendTo(window.top.$("body")); window.top.$("#" + strModalId).modal("show"); } else { $(objHtml).appendTo(this.$("body")); $("#" + strModalId).modal("show"); } } ///动态生成模态窗体顶层显示（通过对像生成） ///strModalId:模态窗体ID ///strTitle:模态窗体标题 ///strContent:模态窗体对像内容 ///strFooter:模态窗体右下角对像内容 ///intWidth:模态窗体的宽度 ///intHeight:模态窗体的高度 var TopModeDialogObjContent = function (strModalId, strTitle, objContent, objFooter, intWidth, intHeight) { blnTop = true; ModeDialogObjContent(strModalId, strTitle, objContent, objFooter, intWidth, intHeight); blnTop = false; } ///动态生成模态窗体（通过URL生成） ///strModalId:模态窗体ID ///strTitle:模态窗体标题 ///strUrl:模态窗体URL ///intWidth:模态窗体的宽度 ///intHeight:模态窗体的高度 var ModeDialogUrl = function (strModalId, strTitle, strUrl, intWidth, intHeight) { if (strUrl == null || strUrl == ‘‘) { abp.message.error("无连接地址", "消息提示"); return; } strUrl = GetPath(strUrl);//标准化地址 var strStyle = ""; if (intWidth != null && intWidth != "") strStyle = "width:" + intWidth + "px;"; if (intHeight != null && intHeight != "") strStyle += "height:" + intHeight + "px"; if (strStyle != "") strStyle = " style=‘" + strStyle + "‘"; var strModalHtml = "<div class=‘modal fade‘ id=‘" + strModalId + "‘ tabindex=‘-1‘ role=‘dialog‘ aria-hidden=‘true‘ aria-hidden=‘true‘ data-backdrop=‘static‘>"; strModalHtml += "<div class=‘modal-dialog‘ " + strStyle + ">"; strModalHtml += "<div class=‘modal-content‘ " + strStyle + ">"; strModalHtml += "<div class=‘modal-header‘>"; strModalHtml += "<button type=‘button‘ class=‘close‘ data-dismiss=‘modal‘ aria-hidden=‘true‘>×</button>"; strModalHtml += "<h4 class=‘modal-title‘ >" + strTitle + "</h4></div>"; strModalHtml += "<div class=‘modal-body‘ style=‘width:100%;‘><iframe style=‘width:100%;height:100%‘ frameborder=‘0‘ scrolling=‘auto‘ src=http://www.mamicode.com/‘" + strUrl + "‘></iframe></div>"; strModalHtml += "</div>"; strModalHtml += "</div>"; strModalHtml += "</div>"; var objHtml = $(strModalHtml); objHtml.find(".modal-body").height($(strModalHtml).find(".modal-content").height() - 75);//设置URL地址的高度 //是否在顶层显示 if (blnTop) { objHtml.appendTo(window.top.$("html")); window.top.$("#" + strModalId).modal("show"); } else { objHtml.appendTo(this.$("html")); $("#" + strModalId).modal("show"); } } ///动态生成模态窗体顶层显示（通过对像生成） ///strModalId:模态窗体ID ///strTitle:模态窗体标题 ///strUrl:模态窗体URL ///intWidth:模态窗体的宽度 ///intHeight:模态窗体的高度 var TopModeDialogUrl = function (strModalId, strTitle, strUrl, intWidth, intHeight) { blnTop = true; ModeDialogUrl(strModalId, strTitle, strUrl, intWidth, intHeight); blnTop = false; } ///模式窗口弹出(指定大小) ///strTitle:窗体标题 ///strUrl:内容显示地址 ///intWidth:窗体宽度 ///intHeight:窗休息高度 var ModelDialog = function (strTitle, strUrl, intWidth, intHeight) { if (strUrl == null || strUrl == ‘‘) { abp.message.error("无连接地址", "消息提示"); return; } strUrl = GetPath(strUrl);//标准化地址 DiyModal.window({ title: strTitle, url: strUrl, width: intWidth, height: intHeight, fullscreen: false ////afterClose: function () { //// table.reload(); ////} }).open(); }; ///模式窗口弹出(全屏展示) ///strTitle:窗体标题 ///strUrl:内容显示地址 var FullModelDialog = function (strTitle, strUrl) { ModelDialog(strTitle, strUrl, (window.innerWidth * 0.96), (window.innerHeight * 0.96)); }; var blnSon = false;//是否子窗口打开 ///浏览器弹出窗口 ///strTitle:窗体标题 ///strUrl:内容显示地址 ///intWidth:窗体宽度 ///intHeight:窗休息高度 var WindowOpen = function (strTitle, strUrl, intWidth, intHeight) { if (strUrl == null || strUrl == ‘‘) { abp.message.error("无连接地址", "消息提示"); return; } strUrl = GetPath(strUrl);//标准化地址 if (strTitle == null || strTitle == ‘‘) { strTitle = ‘‘; } if (intWidth == null || intWidth == ‘‘) { intWidth = 0; } if (intHeight == null || intHeight == ‘‘) { intHeight = 0; } if (intWidth == 0 || intHeight == 0) { window.open(strUrl, strTitle, (blnSon ? ‘fullscreen=0,‘ : ‘‘) + ‘height=‘ + screen.height + ‘, width=‘ + screen.width + ‘, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no‘) } else { window.open(strUrl, strTitle, (blnSon ? ‘fullscreen=0,‘ : ‘‘) + ‘height=‘ + intHeight + ‘, width=‘ + intWidth + ‘, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no‘) } }; ///浏览器弹出窗口 ///strTitle:窗体标题 ///strUrl:内容显示地址 ///intWidth:窗体宽度 ///intHeight:窗休息高度 var WindowSonOpen = function (strTitle, strUrl, intWidth, intHeight) { blnSon = true; WindowOpen(strTitle, strUrl, intWidth, intHeight); blnSon = false; }; ///当前浏览器原地址跳转 ///strUrl:内容显示地址 var WindowLocation = function (strUrl) { if (strUrl == null || strUrl == ‘‘) { abp.message.error("无连接地址", "消息提示"); return; } strUrl = GetPath(strUrl);//标准化地址 window.location.href =http://www.mamicode.com/ strUrl; }; ///当前浏览器顶级窗口地址跳转 ///strUrl:内容显示地址 var WindowTopLocation = function (strUrl) { if (strUrl == null || strUrl == ‘‘) { abp.message.error("无连接地址", "消息提示"); return; } strUrl = GetPath(strUrl);//标准化地址 window.top.location.href =http://www.mamicode.com/ strUrl; }; ///当前浏览器父级窗口地址跳转 ///strUrl:内容显示地址 var WindowParentLocation = function (strUrl) { if (strUrl == null || strUrl == ‘‘) { abp.message.error("无连接地址", "消息提示"); return; } strUrl = GetPath(strUrl);//标准化地址 window.parent.location.href =http://www.mamicode.com/ strUrl; }; ///当前浏览器指定框架地址重定向 ///strUrl:内容显示地址 ///strFrame:是重定向的框架名称 var WindowFramesLocation = function (strFrame, strUrl) { if (strUrl == null || strUrl == ‘‘) { abp.message.error("无连接地址", "消息提示"); return; } strUrl = GetPath(strUrl);//标准化地址 if (strFrame == null || strFrame == ‘‘) { abp.message.error("框架名称为空", "消息提示"); return; } if (window.parent.iframeName != null) {//查找父级IFRAME window.parent.iframeName.location.href =http://www.mamicode.com/ strUrl; } else if (window.parent.frames[strFrame] != null) { //查找父级下面的IFRAME window.parent.frames[strFrame].location.href =http://www.mamicode.com/ strUrl; } else if (window.frames[strFrame] != null) {//查找下级的IFAME window.frames[strFrame].location.href =http://www.mamicode.com/ strUrl; } else { abp.message.error("找不到您所指定的框架名", "消息提示"); } }; ///添加选项卡 ///strUrl:选项卡URL地址 ///strName:选项卡名称 var AddTab = function (strName, strUrl) { if (strUrl == undefined || $.trim(strUrl).length == 0 || strName == undefined || $.trim(strName).length == 0) { abp.message.error("地址及选项卡名称不能为空", "消息提示"); return false; } strUrl = GetPath(strUrl);//标准化地址 var strIframe = "iframe" + Math.floor(Math.random() * 101);//自动生成iframe框架名称及ID var flag = true;//是否存在此选项卡 //查询选项卡中是否已存在了要添加的选项卡，如果存在了，就选中处理 window.parent.$(‘.menuTab‘).each(function () { if ($(this).data(‘id‘) == strUrl) { if (!$(this).hasClass(‘active‘)) { $(this).addClass(‘active‘).siblings(‘.menuTab‘).removeClass(‘active‘); $.learuntab.scrollToTab(this); window.parent.$(‘.mainContent .LRADMS_iframe‘).each(function () { if ($(this).data(‘id‘) == strUrl) { $(this).show().siblings(‘.LRADMS_iframe‘).hide(); return false; } }); } flag = false; return false; } }); //添加选项卡 if (flag) { var str = ‘<a href="javascript:;" class="active menuTab" data-id="‘ + strUrl + ‘">‘ + strName + ‘ <i class="fa fa-remove"></i></a>‘; window.parent.$(‘.menuTab‘).removeClass(‘active‘); var str1 = ‘<iframe class="LRADMS_iframe" id="‘ + strIframe + ‘" name="‘ + strIframe + ‘" width="100%" height="100%" src="http://www.mamicode.com/‘ + strUrl + ‘" frameborder="0" data-id="‘ + strUrl + ‘" seamless></iframe>‘; window.parent.$(‘.mainContent‘).find(‘iframe.LRADMS_iframe‘).hide(); window.parent.$(‘.mainContent‘).append(str1); window.parent.$(‘.menuTabs .page-tabs-content‘).append(str); $.learuntab.scrollToTab($(‘.menuTab.active‘)); } }; ///AJAX请求 ///strUrl:请求URL ///btnObj:请求按钮对像 var AjaxFun = function (strUrl, btnObj) { var paramData = "http://www.mamicode.com/{‘" + GetParamJson(strUrl) + "‘}"; var btnName = btnObj.innerText; var strUrl = GetPath(strUrl); $.ajax({ url: strUrl, type: ‘POST‘, dataType: ‘JSON‘, data: paramData, success: function (result) { if (result != null) { abp.message.success("", btnName + "成功！"); } }, complete: function (XMLHttpRequest, status) { //请求完成后最终执行参数 if (status != ‘success‘) { abp.message.error("状态为：" + status, btnName + "请求有误！"); } } }); };
js 自己项目中几种打开或弹出页面的方法
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。