在前端页面中,弹窗是经常会用到的。使用iframe可以实现,但是要调页面元素,有些繁琐。前不久,发现JS中的showModalDialog方法就可以简单有效的实现弹窗,而且效果不错,故用之。实现方法非常简单:
window.showModalDialog(“A.jsp?r="+Math.random(),"", "dialogHeight=500px;dialogwidth=1200px;center=yes;"+
+"help=no;resizable=yes;status=no;scrollbars=yes;");
即可弹出A.jsp页面,其中参数r为了动态加载。
但在项目中,经常会用SSH框架,就会用到Action,实现道理也一样:
window.showModalDialog("getUser.action?r="+Math.random(),
"", "dialogHeight=500px;dialogwidth=1200px;center=yes;"+
+"help=no;resizable=yes;status=no;scrollbars=yes;");
如果有参数要传递呢,相信大家都能想到了:
var url = "getUser.action?r="+Math.random()+"&type=modify"+"&name=abc";
window.showModalDialog(url,"", "dialogHeight=500px;dialogwidth=1200px;center=yes;"+
+"help=no;resizable=yes;status=no;scrollbars=yes;");
即可轻松实现。但是,要注意的是,参数里不能有中文字符,否则就会导致窗口内容空白,因为Action根本进不来!!
解决方法:在调用showModalDialog前进行一下转码:
url = encodeURI(encodeURI(url));//中文转码
后台取值示例:
String name=java.net.URLDecoder.decode(name,"UTF-8");
至此,即可大功告成。