像discuz这样的弹出框是什么思路来的

Question

http://nt.discuz.net/index.aspx
先上一个地址
我指的是注册，登陆弹出的那个框子。在任何子页面可以弹出这个登录的层，都可以登陆和注册。怎么实现的呢？如果在页面上提前放好登陆框提交按钮，用ajax一下就实现了，这个很简单。
问题就在于既要弹出对话框，又要实现提交功能，提交后还要停留在这个页面上。我不认为是每个页面都把这些框子放好并且隐藏，当点击登陆的时候动态弹出就行，事实确实也不是。（有些网站每个页面都有几十个这样的弹出框，如果这种方法那就太累了）如果采用vs自带的ajax控件能否做出这样的效果呢？总觉得很玄。
这个登陆类应该怎么实现呢，有思路的透露点思路，因为这个问题抑郁过好长时间了。

Answer 1

http://topic.csdn.net/u/20090811/23/a0812cf7-4989-408b-b73c-ad6faf458369.html

Answer 2

ajax+div
里面可以放个iframe

Answer 3

感谢楼上的，我的问题其实跟那个lz一样，关键是后台怎么交互。
帖子中说那个是div中包含iframe，这个是个不错的思路
不过，我在弹出框中查看源代码，发现没有显示出iframe中的代码，可能它们并没有采用这种方法实现吧。

Answer 4

使用asp.net ajax control toolkit中的 ModalPopup控件。

Answer 5

onClick="floatwin('open_login', '/bbs/login.aspx', 600, 410);return false;">看看它的源码就知道

Answer 6

就是
你在地址栏 输入 http://nt.discuz.net/register.aspx
看看

Answer 7

我贴上来floatwin代码研究一下//FloatWin
var hiddenobj = new Array();
var floatwinhandle = new Array();
var floatscripthandle = new Array();
var floattabs = new Array();
var floatwins = new Array();
var InFloat = '';
var floatwinreset = 0;
var floatwinopened = 0;
var STYLEID = '1';
var VERHASH = 'Pvt'
function floatwin(action, script, w, h, scrollpos) {
var floatonly = !floatonly ? 0 : 1;
var actione = action.split('_');
action = actione[0];
if(script && script != -1)
    script += script.indexOf("?") != -1 ? "&stamp=" + Math.random() : "?stamp=" + Math.random();
if((!allowfloatwin || allowfloatwin == 0) && action == 'open' && in_array(actione[1], ['register','login','newthread','reply','edit']) && w >= 600) {
location.href = script;
return;
}
var handlekey = actione[1];
var layerid = 'floatwin_' + handlekey;
if(is_ie) {
var objs = $('wrap').getElementsByTagName("OBJECT");
} else {
var objs = $('wrap').getElementsByTagName("EMBED");
}
if(action == 'open') {
loadcss('float');
floatwinhandle[handlekey + '_0'] = layerid;
if(!floatwinopened) {
$('wrap').onkeydown = floatwin_wrapkeyhandle;
for(i = 0;i < objs.length; i ++) {
if(objs[i].style.visibility != 'hidden') {
objs[i].setAttribute("oldvisibility", objs[i].style.visibility);
objs[i].style.visibility = 'hidden';
}
}
}
scrollpos = !scrollpos ? '' : 'floatwin_scroll(\'' + scrollpos + '\');';
var clientWidth = document.body.clientWidth;
var clientHeight = document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight;
var scrollTop = document.body.scrollTop ? document.body.scrollTop : document.documentElement.scrollTop;
if(script && script != -1) {
if(script.lastIndexOf('/') != -1) {
script = script.substr(script.lastIndexOf('/') + 1);
}
var scriptfile = script.split('?');
scriptfile = scriptfile[0];
if(in_array(scriptfile,['posttopic.aspx','postreply.aspx','editpost.aspx']))
{
scriptfile='post.aspx';
}
if(floatwinreset || floatscripthandle[scriptfile] && floatscripthandle[scriptfile][0] != script) {
if(!isUndefined(floatscripthandle[scriptfile])) {
$('append_parent').removeChild($(floatscripthandle[scriptfile][1]));
$('append_parent').removeChild($(floatscripthandle[scriptfile][1] + '_mask'));
}
floatwinreset = 0;
}
floatscripthandle[scriptfile] = [script, layerid];
}
if(!$(layerid)) {
floattabs[layerid] = new Array();
div = document.createElement('div');
div.className = 'floatwin';
div.id = layerid;
div.style.width = w + 'px';
div.style.height = h + 'px';
div.style.left = floatwinhandle[handlekey + '_1'] = ((clientWidth - w) / 2) + 'px';
div.style.position = 'absolute';
div.style.zIndex = '10002';
div.onkeydown = floatwin_keyhandle;
$('append_parent').appendChild(div);
$(layerid).style.display = '';
$(layerid).style.top = floatwinhandle[handlekey + '_2'] = ((clientHeight - h) / 2 + scrollTop) + 'px';
$(layerid).innerHTML = '<div><h3 class="float_ctrl"><em><img src="' + IMGDIR + '/loading.gif"> 加载中...</em><span><a href="javascript:;" class="float_close" onclick="floatwinreset = 1;floatwin(\'close_' + handlekey + '\');">&nbsp</a></span></h3></div>';
divmask = document.createElement('div');
divmask.className = 'floatwinmask';
divmask.id = layerid + '_mask';
divmask.style.width = (parseInt($(layerid).style.width) + 14) + 'px';
divmask.style.height = (parseInt($(layerid).style.height) + 14) + 'px';
divmask.style.left = (parseInt($(layerid).style.left) - 6) + 'px';
divmask.style.top = (parseInt($(layerid).style.top) - 6) + 'px';
divmask.style.position = 'absolute';
divmask.style.zIndex = '10001';
divmask.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=90,finishOpacity=100,style=0)';
divmask.style.opacity = 0.9;
$('append_parent').appendChild(divmask);
if(script && script != -1) {
script += (script.search(/\?/) > 0 ? '&' : '?') + 'infloat=1&handlekey=' + handlekey;
try {
ajaxget(rooturl+script, layerid, '', '', '', scrollpos);
} catch(e) {
setTimeout("ajaxget('" + (rooturl+script) + "', '" + layerid + "', '', '', '', '" + scrollpos + "')", 1000);
}
} else if(script == -1) {
$(layerid).innerHTML = '<div><h3 class="float_ctrl"><em id="' + layerid + '_title"></em><span><a href="javascript:;" class="float_close" onclick="floatwinreset = 1;floatwin(\'close_' + handlekey + '\');">&nbsp</a></span></h3></div><div id="' + layerid + '_content"></div>';
$(layerid).style.zIndex = '1099';
$(layerid + '_mask').style.zIndex = '1098';
}
} else {
$(layerid).style.width = w + 'px';
$(layerid).style.height = h + 'px';
$(layerid).style.display = '';
$(layerid).style.top = floatwinhandle[handlekey + '_2'] = ((clientHeight - h) / 2 + scrollTop) + 'px';
$(layerid + '_mask').style.width = (parseInt($(layerid).style.width) + 14) + 'px';
$(layerid + '_mask').style.height = (parseInt($(layerid).style.height) + 14) + 'px';
$(layerid + '_mask').style.display = '';
$(layerid + '_mask').style.top = (parseInt($(layerid).style.top) - 6) + 'px';
}
floatwins[floatwinopened] = handlekey;
floatwinopened++;

} else if(action == 'close' && floatwinhandle[handlekey + '_0']) {
floatwinopened--;
for(i = 0;i < floatwins.length; i++) {
if(handlekey == floatwins[i]) {
floatwins[i] = null;
}
}
if(!floatwinopened) {
for(i = 0;i < objs.length; i ++) {
if(objs[i].attributes['oldvisibility']) {
objs[i].style.visibility = objs[i].attributes['oldvisibility'].nodeValue;
objs[i].removeAttribute('oldvisibility');
}
}
$('wrap').onkeydown = null;
}
hiddenobj = new Array();
$(layerid + '_mask').style.display = 'none';
$(layerid).style.display = 'none';
} else if(action == 'size' && floatwinhandle[handlekey + '_0']) {
if(!floatwinhandle[handlekey + '_3']) {
var clientWidth = document.body.clientWidth;
var clientHeight = document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight;
var w = clientWidth > 800 ? clientWidth * 0.9 : 800;
var h = clientHeight * 0.9;
floatwinhandle[handlekey + '_3'] = $(layerid).style.left;
floatwinhandle[handlekey + '_4'] = $(layerid).style.top;
floatwinhandle[handlekey + '_5'] = $(layerid).style.width;
floatwinhandle[handlekey + '_6'] = $(layerid).style.height;
$(layerid).style.left = floatwinhandle[handlekey + '_1'] = ((clientWidth - w) / 2) + 'px';
$(layerid).style.top = floatwinhandle[handlekey + '_2'] = ((document.documentElement.clientHeight - h) / 2 + document.documentElement.scrollTop) + 'px';
$(layerid).style.width = w + 'px';
$(layerid).style.height = h + 'px';
} else {
$(layerid).style.left = floatwinhandle[handlekey + '_1'] = floatwinhandle[handlekey + '_3'];
$(layerid).style.top = floatwinhandle[handlekey + '_2'] = floatwinhandle[handlekey + '_4'];
$(layerid).style.width = floatwinhandle[handlekey + '_5'];
$(layerid).style.height = floatwinhandle[handlekey + '_6'];
floatwinhandle[handlekey + '_3'] = '';
}
$(layerid + '_mask').style.width = (parseInt($(layerid).style.width) + 14) + 'px';
$(layerid + '_mask').style.height = (parseInt($(layerid).style.height) + 14) + 'px';
$(layerid + '_mask').style.left = (parseInt($(layerid).style.left) - 6) + 'px';
$(layerid + '_mask').style.top = (parseInt($(layerid).style.top) - 6) + 'px';
}
}