我们接着“模态窗口浅析一”来讲。现在讲第二种方案的实现,补充一下,模态窗口里的栏目信息列表是可以翻页的啊。
一:打开一个窗口:
function openChild(){
/*打开一个窗口,column_details.do这个action会查询栏目信息,然后把信息分页展示在column_details.jsp这个页面上;
窗口会装载column_details.jsp这个页面;
传一个window变量过去,用于和子窗口进行数据交换
后边的参数是对窗口属性的设置
*/
var k = window.showModalDialog("column_details.do",window,"dialogWidth:500px;status:no;dialogHeight:600px");
//获得单击 column_details.jsp页面上的一条栏目的ID,并把值付给栏目ID的输入框
if(k != undefined){
var a=k.content;
document.getElementById("columnID").value =a;
}
}
二:单击column_details.jsp上的“确定”对应的事件
function retrunValue()
{
var k = new Object();
var arr = document.getElementsByName('column_Id_radio');
for(var i=0;i<arr.length;i++){
if(arr[i].checked)
k.content = arr[i].value;
}
window.returnValue = k;
window.close();
}
这个实现在IE8和FireFox都是可以的。但是有点落后啊,落后的原因是不同浏览器对window对象的支持不同,这回造成跨浏览器方面的一些问题。
我们会在“模态窗口浅析三”中探讨用jquery UI 的一个dialog来实现。dialog打开的不是一个真正的window,二是一个用div模拟的窗口,如果我们要装载一个需要分页的页面,要注意哦。。。