jquery模型对话框。 [英] jquery model dialog box.
本文介绍了jquery模型对话框。的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
Here is my full Html Page
<html>
<head>
<title>Start Page</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/redmond/jquery-ui.css" type="text/css" />
<script type="text/javascript">
var $dialog = null;
jQuery.showModalDialog = function(options) {
var defaultOptns = {
url: null,
dialogArguments: null,
height: 'auto',
width: 'auto',
position: 'center',
resizable: true,
scrollable: true,
onClose: function() { },
returnValue: null,
doPostBackAfterCloseCallback: false,
postBackElementId: null
};
var fns = {
close: function() {
opts.returnValue = $dialog.returnValue;
$dialog = null;
opts.onClose();
if (opts.doPostBackAfterCloseCallback) {
postBackForm(opts.postBackElementId);
}
},
adjustWidth: function() { $frame.css("width", "100%"); }
};
var opts = $.extend({}, defaultOptns, options);
var $frame = $('<iframe id="iframeDialog" />');
if (opts.scrollable)
$frame.css('overflow', 'auto');
$frame.css({
'padding': 0,
'margin': 0,
'padding-bottom': 10
});
var $dialogWindow = $frame.dialog({
autoOpen: true,
modal: true,
width: opts.width,
height: opts.height,
resizable: opts.resizable,
position: opts.position,
overlay: {
opacity: 0.5,
background: "black"
},
close: fns.close,
resizeStop: fns.adjustWidth
});
$frame.attr('src', opts.url);
fns.adjustWidth();
$frame.load(function() {
if ($dialogWindow) {
var maxTitleLength = 50;
var title = $(this).contents().find("title").html();
if (title.length > maxTitleLength) {
title = title.substring(0, maxTitleLength) + '...';
}
$dialogWindow.dialog('option', 'title', title);
}
});
$dialog = new Object();
$dialog.dialogArguments = opts.dialogArguments;
$dialog.dialogWindow = $dialogWindow;
$dialog.returnValue = null;
}
function postBackForm(targetElementId) {
var theform;
theform = document.forms[0];
theform.__EVENTTARGET.value = targetElementId;
theform.__EVENTARGUMENT.value = "";
theform.submit();
}
// function to open THE POPUP
var inc=1;
function test()
{
while(inc <=2)
{
debugger;
if(inc==1)
{
var url = 'TestPopup1.html';
$.showModalDialog({
url: url,
dialogArguments: 'First Dialog',
height: 300,
width: 400,
scrollable: false,
onClose: function(){ var returnedValue = this.returnValue; }
});
}
if (inc == 2) {
var url = 'TestPopup2.html';
$.showModalDialog({
url: url,
dialogArguments: 'Second Dialog',
height: 300,
width: 400,
scrollable: false,
onClose: function () { var returnedValue = this.returnValue; }
});
}
inc=inc+1;
}
}
</script>
</head>
<body>
<input type="button" onclick="test();" value="Open Popup" />
</body>
</html>
我的问题是当我点击打开弹出按钮时第一个对话框被打开第二个对话框没有打开请帮我打开两个弹出窗口。
ie
当值为变量inc == 1然后第一个弹出窗口应该打开
和变量inc值== 2然后第二个弹出窗口uld open
My problem is when I click Open Popup Button the First Dialog gets open and second dialog does not open please help me to open both popup.
i.e.
when value of variable inc == 1 then First popup should open
and value of variable inc == 2 then Second popup should open
推荐答案
dialog = null;
jQuery.showModalDialog = function（options）{
var defaultOptns = {
url：null，
dialogArguments：null，
height：'auto'，
width：'auto'，
position：'center'，
resizable：true，
scrollable：true，
onClose ：function（）{}，
returnValue：null，
doPostBackAfterCloseCallback：false，
postBackElementId：null
};
var fns = {
close：function（）{
opts.returnValue =
dialog = null; jQuery.showModalDialog = function(options) { var defaultOptns = { url: null, dialogArguments: null, height: 'auto', width: 'auto', position: 'center', resizable: true, scrollable: true, onClose: function() { }, returnValue: null, doPostBackAfterCloseCallback: false, postBackElementId: null }; var fns = { close: function() { opts.returnValue =
dialog.returnValue;
dialog.returnValue;
dialog = null;
opts.onClose（）;
if（opts.doPostBackAfterCloseCallback）{
postBackForm（opts.postBackElementId）;
}
}，
adjustWidth：function（）{
dialog = null; opts.onClose(); if (opts.doPostBackAfterCloseCallback) { postBackForm(opts.postBackElementId); } }, adjustWidth: function() {
这篇关于jquery模型对话框。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
