JSP常用开发技巧(1)

wangxuqin 2010-10-07

展开全文

本章要点

1.客户端编程的常用技术：动态表格，网页传值，动态框架，表单验证等

2.发送Email，绘制图形，文本上传

3.编写国际化应用

3种网页对话框

在Web应用开发中，有3种形式的网页对话框：

1）使用window.open打开网页

2）使用Web模式对话框

3）使用Web非模式对话框。

程序名称：8_03.html

function openNewWindow(szMethod)

{

if(szMethod == "modal")

{

window.showModalDialog("8_01.html");

}

else if(szMethod == "modeless")

{

window.showModelessDialog("8_01.html");

}

else

{

window.open("8_01.html");

}

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

3种对话框的区别是利用window.open打开的页面和其他的窗口一样，可以在几个窗口之间的切换：

模式对话框不能和其他窗口切换焦点，只能是当前焦点。

非模式对话框可以和其他窗口切换焦点，但那是永远在屏幕最前面。

绘画狂和页面之间传递变量是Web应用开发最常用的技术。

程序名称：carry_value.html(3种形式的网页对话框的传值)

<HTML><HEAD>
<SCRIPT LANGUAGE="JavaScript">
function openNewWindow(method)
{
  if(method == "modal")
  {
   window.showModalDialog("8_06.html",MYFORM.TXT,
   "dialogTop:100px;dialogLeft:100px;dialogWidth:200px;dialogHeight:400px;scroll:1;status:0;");
  }
  else if(method =="modeless")
  {
   window.showModelessDialog("8_06.html",MYFORM.TXT,
   "dialogTop:100px;dialogLeft:100px;dialogWidth:200px;dialogHeight:400px;scroll:1;status:0;");
  }
  else
  {
   window.open("8_05.html");
  }
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="MYFORM">
<INPUT TYPE="BUTTON" VALUE="normal" ONCLICK="openNewWindow('normal');"><BR>
<INPUT TYPE="BUTTON" VALUE="modal" ONCLICK="openNewWindow('modal');"><BR>
<INPUT TYPE="BUTTON" VALUE="modelss"ONCLICK="openNewWindow('modeless');"><BR>
<INPUT TYPE="TEXT" NAME="TXT">
</FORM>
</BODY>
</HTML>

利用window.open打开8_05.html，要传递变量就要建立连个窗口之间的关系，子窗口中利用opener来引用父窗口

这样可以得到父窗口内的元素的值。

程序名称：8_05.html

<HTML>
<SCRIPT LANGUAGE="JavaScript">
function tran()
{
opener.MYFORM.TXT.value = document.MYFORM.TXT.value;
window.close();
}
</SCRIPT>
<BODY>
<FORM NAME="MYFORM">
<INPUT TYPE="TEXT" NAME="TXT" VALUE="测试">
<INPUT TYPE="BUTTON" VALUE="传递" ONCLICK="tran()">
</FORM>
</BODY>
</HTML>

单击父窗口的按钮，打开程序8_05.html，在窗口中输入一些字符串，单击按钮传递，值会显示在父窗口的文本框中。

模式与非模式对话框传递值方法是一样的，只要对window.dialogArguments.value赋值就可以了。

程序名称：8_06.html

<HTML>
<SCRIPT LANGUAGE="JavaScript">
function tran()
{
window.dialogArguments.value = document.MYFORM.TXT.VALUE;
window.close();
}
</SCRIPT>
<BODY>
<FORM NAME="MYFORM">
<INPUT TYPE="TEXT" NAME="TXT" VALUE="测试">
<INPUT TYPE="BUTTON"VALUE="传递" ONCLICK="tran()">
</FORM>
</BODY>
</HTML>