div及２级联动表的使用心得
2级联动表部分代码：
先将需要隐藏的内容写到以下的<div>标签中该标签的属性写成如下格式：
<div id="xxxx" style="display:none;">
</div>
以上代码表示，在div块中的代码将会被隐藏然后再javaScript代码中可写出方法使其显示,代码如下：
<script>
function test(){
var a=document.getElementById("xxx");
a.style.display="block";
}
2级联动表可通过该功能来实现，例：
html代码：<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link href="./css/main.css" rel="stylesheet" type="text/css" />
</head>
<script src="./js/tool.js"></script>
<link href="./css/bodyStyle.css" rel="stylesheet" type="text/css">
<BODY BGCOLOR="ffffff" TEXT="000000" LINK="FF8000" VLINK="FF8000" Marginwidth=250 marginheight=250 leftmargin=100>
<table><tr align=center width='100%'><td colspan="2"><font size="6" color="#0000FF">Wdems示例展示首页</td><tr></table>
<jsp:include flush="true" page="test.jsp"></jsp:include>
<form name="form2">
<div id="frames">
<fieldset>
<legend>打印参数设置</legend>
<select name ="filename" onClick="setFileName()">
<option value="pass_goods_in">pass_goods_in</option>
<option value="DATE_and_HIDDEN_and_LIST_test_editmode_3">DATE_and_HIDDEN_and_LIST_test_editmode_3</option>
<option value="real">real</option>
<option value="TCertG21_0003">TCertG21_0003</option>
<option value="PICC">PICC</option>
<option value="AD_CONTRACT">AD_CONTRACT</option>
<option value="ecrPrnt">ecrPrnt</option>
<option value="test_use">test_use</option>
<option value="code128">code128</option>
<option value="stat">stat</option>
<option value="stat1">stat1</option>
<option value="CERT_B">FORMB</option>
<option value="FORM_P">FORM_P</option>
<option value="pass_goods_in">pass_goods_in</option>
<option value="goods_out">goods_out</option>
<option value="pass_goods_out">pass_goods_out</option>
<option value="chonfu_test">chonfu_test</option>
<option value="nine">九城表单测试</option>
<option value="FO-Element-test">FO元素和属性测试</option>
<option value="schemaobj_test">schemaobj_test</option>
<option value="font_text">font_text</option>
<option value="xialaliebiao_text">xialaliebiao_text</option>
<option value="riqi_text">riqi_text</option>
<option value="xialaliebiaowenti_text">xialaliebiaowenti_text</option>
<option value="riqiwenti_text">riqiwenti_text</option>
<option value="font_text2">font_text2</option>
<option value="baoxian">baoxian</option>
</select>
<TABLE width="700" height="40" BORDER=0 CELLPADDING=0 CELLSPACING=0>
<tr width="200">
<td width="150">
<select id="sle0" name="sle0" onClick="setValues1()">
<option value="change">请选择数据处理方式</option>
<option value="server">服务器端解析数据</option>
<option value="0">统一客户端</option>
</select>
</td>
<td width="150">
<div id="htmlPrintMode" style="display:none;">
<table>
<select id="sle1"name="sle1" onClick="setValues1()">
<option>前台显示</option>
<option value="2">后台打印</option>
<option value="3">生成文件</option>
</select>
</table>
</div>
</td>
<td width="20">
<div id="htmlPrintType" style="display:none;">
<table>
<select id="sle2" name="sle2" onClick="setValues1()">
<option >分组打印</option>
<option value="pr">打印</option>
<option value="4">打印PCL文件</option>
<option value="5">打印PS文件</option>
</select>
</table>
</div>
</td>
<td width="150">
<div id="htmlPrintFile" style="display:none;">
<table>
<select id="sle3" name="sle3" onClick="setValues1()">
<option value="8">生成PCL文件</option>
<option value="9">生成PS文件</option>
<option value="10">生成TXT文件</option>
<option value="11">生成png文件</option>
</select>
</table>
</div>
</td>
<td width="400">
<div id="htmlPrinterName" style="display:none;">
<table>请输入打印机名称<input type="text" id="printName" name="printName" value=""/></table>
</div>
</td>
</tr>
<tr align="right">隐藏打印并关闭按钮<input type="checkbox" id="printAndClose" name="printAndClose" value="no" ></tr>
<tr>不允许打印<input type="checkbox" id="isPrint" name="isPrint" value="no"></tr>
<tr>使用平滑处理<input type="checkbox" id="antialias" name="antialias" value="yes"></tr>
<tr>可进行编辑<input type="checkbox" id="isEdit" name="isEdit" value="yes"></tr>
<tr>工具栏位置<select name="tool" id="tool" value="">
<option value="top">top</option>
<option value="left">left</option>
<option value="right">right</option>
<option value="hide">hide</option>
</select>
</tr>
<tr>显示比例测试<input type="text" name="percent" id="percent"></tr>
</table>
<div id="htmlbut1" style="display:none;">
数据读取方式 <select name="data" id="data" value="">
<option value="readFile">直接读取文件</option>
<option value="servlet">通过Servlet读取文件</option>
</select>
<br><br><input type="button" value="Test" onClick="client()"/>
</div>
<div id="htmlbut2" style="display:none;">
<input type="button" value="Test" onClick="server()"/>
</div>
<div id="htmlbut3" style="display:none;">
<input type="button" value="提交" onClick="openWindow()"/>
</div>
</div>
</form>
<div id="htmlapp" style="display:none;">
<jsp:include page="/wisii/jsp/init.jsp" flush="true" />
</div>
</body>
</html>
javaScipt代码：
var str="";
var args1="AllBrowseTask,";
var args4="-servlet,/servlet/AllClientServlet?filename=";
var args2="frontServletTask,servlet/ClientfrontServlet?filename=";
var args3="BackServletTask,servlet/ClientfrontServlet?filename=";
var args5="-xml,";
var args6=",-xsl,"
function wisiiRecall()
{
}
function setValues1(){
var filename=document.all.filename.value;
var htmlPrintMode=document.getElementById("htmlPrintMode");
var htmlPrintType=document.getElementById("htmlPrintType");
var htmlPrintFile=document.getElementById("htmlPrintFile");
var htmlPrinterName=document.getElementById("htmlPrinterName");
var htmlbut1=document.getElementById("htmlbut1");
var htmlbut2=document.getElementById("htmlbut2");
var htmlbut3=document.getElementById("htmlbut3");
var sele0=document.forms[0].elements[2];
var select0=sele0.options[sele0.selectedIndex].value;
var sele1=document.forms[0].elements[3];
var select1=sele1.options[sele1.selectedIndex].value;
var sele2=document.forms[0].elements[4];
var select2=sele2.options[sele2.selectedIndex].value;
var sele3=document.forms[0].elements[5];
var select3=sele3.options[sele3.selectedIndex].value;
if(select0 == 0){
htmlbut1.style.display="block"
htmlbut2.style.display="none";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="none";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="none";
htmlapp.style.display="block";
str=",-awt";
if(select1==2){
htmlbut1.style.display="block"
htmlbut2.style.display="none";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="block";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="none";
htmlapp.style.display="none";
if(select2=="pr"){
str="";
str=",-print";
}else
{
str="";
str=",-printSquence";
}
if(select2==4){
htmlbut1.style.display="block"
htmlbut2.style.display="none";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="block";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="block";
htmlapp.style.display="none";
str="";
str=",-pcl";
}
else if(select2==5){
htmlbut1.style.display="block"
htmlbut2.style.display="none";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="block";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="block";
htmlapp.style.display="none";
str="";
str=",-ps";
}
}
else if(select1 == 3){
htmlbut1.style.display="block"
htmlbut2.style.display="none";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="none";
htmlPrintFile.style.display="block";
htmlPrinterName.style.display="none";
htmlapp.style.display="none";
str="";
str=",-pcl,Mypcl.pcl"
if(select3==8){
str="";
printerName=""
str=",-pcl,Mypcl.pcl"
}else if(select3==9){
str="";
str=",-ps,Myps.ps"
}else if(select3==10){
str="";
str=",-txt,Mytxt.txt"
}else if(select3==11){
str="";
str=",-png,Mypng.png"
}
}
}else if(select0=="server"){
htmlbut1.style.display="none"
htmlbut2.style.display="block";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="none";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="none";
htmlapp.style.display="block";
str=args2+filename+",-awt";
if(select1==2){
htmlbut1.style.display="none"
htmlbut2.style.display="block";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="block";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="none";
htmlapp.style.display="none";
if(select2=="pr"){
str="";
str=args3+filename+",-print";
}else
{
str="";
str=args3+filename+",-printSquence";
}
if(select2==4){
htmlbut1.style.display="none"
htmlbut2.style.display="block";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="block";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="block";
htmlapp.style.display="none";
str="";
str=args3+filename+",-pcl";
}
else if(select2==5){
htmlbut1.style.display="none"
htmlbut2.style.display="block";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="block";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="block";
htmlapp.style.display="none";
str="";
str=args3+filename+",-ps";
}
}
else if(select1 == 3){
htmlbut1.style.display="none"
htmlbut2.style.display="block";
htmlbut3.style.display="none";
htmlPrintMode.style.display="block";
htmlPrintType.style.display="none";
htmlPrintFile.style.display="block";
htmlPrinterName.style.display="none";
htmlapp.style.display="none";
str="";
str=args3+filename+",-pcl,Mypcl.pcl"
if(select3==8){
str="";
printerName=""
str=args3+filename+",-pcl,Mypcl.pcl"
}else if(select3==9){
str="";
str=args3+filename+",-ps,Myps.ps"
}else if(select3==10){
str="";
str=args3+filename+",-txt,Mytxt.txt"
}else if(select3==11){
str="";
str=args3+filename+",-png,Mypng.png"
}
}
}else{
htmlbut1.style.display="none";
htmlbut2.style.display="none";
htmlbut3.style.display="block";
htmlPrintMode.style.display="none";
htmlPrintType.style.display="none";
htmlPrintFile.style.display="none";
htmlPrinterName.style.display="none";
htmlapp.style.display="none";
//str="AllBrowseTask,"+xml+filename+".xml"+xsl+filename+".xsl,-awt";
}
}
function client(){
setValues1();
printerName=document.getElementById("printName").value;
var filename=document.all.filename.value;
var printAndClose=document.getElementsByName("printAndClose");
var isPrint=document.getElementsByName("isPrint");
var antialias=document.getElementsByName("antialias");
var isEdit=document.getElementsByName("isEdit");
var percent=document.getElementById("percent").value;
var tool=document.all.tool.value;
var data=document.all.data.value;
if(isPrint[0].checked){
isPrint=",-isPrint,no";
}else{
isPrint="";
}
if(printAndClose[0].checked){
printAndClose=",-printAndClose,no";
}else{
printAndClose="";
}
if(antialias[0].checked){
antialias=",-antialias,yes";
}else{
antialias="";
}
if(isEdit[0].checked){
isEdit=",-editable,yes";
}else{
isEdit="";
}
if(percent==""){
percent=",-percent,100";
}else if(percent<=20){
percent=",-percent,20";
}else if(percent>=500){
percent=",-percent,500";
}else{
percent=",-percent,"+percent;
}
if(tool==""){
tool="";
}else if(tool=="top"){
tool=",-location,top"
}else if(tool=="right"){
tool=",-location,right"
}else if(tool=="left"){
tool=",-location,left"
}else if(tool=="hide"){
tool=",-location,hide"
}
if(data=="servlet"){
data=args4+filename;
}else{
data=args5+filename+".xml"+args6+filename+".xsl";
}
if(printerName==""){
printerName="";
}else{
printerName=","+printerName;
}
str=args1+data+str+printerName+isPrint+printAndClose+antialias+percent+tool+isEdit;
document.applets.TestApplet.askWiApplet(str);
str="";
document.getElementById("printName").value="";
}
function server(){
setValues1();
printerName=document.getElementById("printName").value;
var filename=document.all.filename.value;
var printAndClose=document.getElementsByName("printAndClose");
var isPrint=document.getElementsByName("isPrint");
var antialias=document.getElementsByName("antialias");
var isEdit=document.getElementsByName("isEdit");
var percent=document.getElementById("percent").value;
var tool=document.all.tool.value;
var data=document.all.data.value;
if(isPrint[0].checked){
isPrint=",-isPrint,no";
}else{
isPrint="";
}
if(printAndClose[0].checked){
printAndClose=",-printAndClose,no";
}else{
printAndClose="";
}
if(antialias[0].checked){
antialias=",-antialias,yes";
}else{
antialias="";
}
if(isEdit[0].checked){
isEdit=",-editable,yes";
}else{
isEdit="";
}
if(percent==""){
percent=",-percent,100";
}else if(percent<=20){
percent=",-percent,20";
}else if(percent>=500){
percent=",-percent,500";
}else{
percent=",-percent,"+percent;
}
if(tool==""){
tool=",-location,top";
}else if(tool=="top"){
tool=",-location,top"
}else if(tool=="right"){
tool=",-location,right"
}else if(tool=="left"){
tool=",-location,left"
}else if(tool=="hide"){
tool=",-location,hide"
}
if(data=="servlet"){
data=args4+filename;
}else{
data=args5+filename+".xml"+args6+filename+".xsl";
}
if(printerName==""){
printerName="";
}else{
printerName=","+printerName;
}
str=str+printerName+isPrint+printAndClose+antialias+percent+tool+isEdit;
document.applets.TestApplet.askWiApplet(str);
str="";
document.getElementById("printName").value="";
}
function setFileName(){
setValues1();
}
function openWindow(){
window.open("servlet/Servlet?filename="+document.all.filename.value+"&percent="+document.all.percent.value+"&isPrint="+document.all.isPrint.checked+"&printAndClose="+document.all.printAndClose.checked+"&antialias="+document.all.antialias.checked+"&location="+document.all.tool.value+"&isEdit="+document.all.isEdit.checked);
}
