代碼如下:
[code]
<head>
<style type="text/css">
<!--
.style2 {color: #FFA642}
.style4 {
font-size: 18px;
font-weight: bold;
}
-->
</style>
<style type="text/css">
<!--
.style1 {color: #000000}
.style2 {font-size: 18px}
.style4 {font-size: 16px}
.style5 {
font-size: 18px;
color: #990000;
font-weight: bold;
}
.style12 {
font-size: 18px;
color: #010101;
font-weight: bold;
}
.style13 { font-size: 18px;
color: #010101;
font-weight: bold;
}
.style13 {font-size: 16px}
body {
background-color: #ADBACE;
}
.dstyle{ font-size: 17px;
color: #990000; }
.tstyle{font-size: 16px;
color: #990000;}
-->
</style>
</head>
<script>
function editTab()
{
var code, sel, tmp, r
var tabs=""
event.returnValue = false
sel =event.srcElement.document.selection.createRange()
r = event.srcElement.createTextRange()
switch (event.keyCode)
{
case (8) :
if (!(sel.getClientRects().length > 1))
{
event.returnValue = true
return
}
code = sel.text
tmp = sel.duplicate()
tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top)
sel.setEndPoint("startToStart", tmp)
sel.text = sel.text.replace(/^\t/gm, "")
code = code.replace(/^\t/gm, "").replace(/\r\n/g, "\r")
r.findText(code)
r.select()
break
case (9) :
if (sel.getClientRects().length > 1)
{
code = sel.text
tmp = sel.duplicate()
tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top)
sel.setEndPoint("startToStart", tmp)
sel.text = "\t"+sel.text.replace(/\r\n/g, "\r\t")
code = code.replace(/\r\n/g, "\r\t")
r.findText(code)
r.select()
}
else
{
sel.text = "\t"
sel.select()
}
break
case (13) :
tmp = sel.duplicate()
tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top)
tmp.setEndPoint("endToEnd", sel)
for (var i=0; tmp.text.match(/^[\t]+/g) && i<tmp.text.match(/^[\t]+/g)[0].length; i++) tabs += "\t"
sel.text = "\r\n"+tabs
sel.select()
break
default :
event.returnValue = true
break
}
}
</script>
<body background="BACK25.gif">
<form name="frm" action="a_chuli.jsp" method="post" >
<div align="center">
<table width="676">
<tr bgcolor="#666666">
<td height="20" colspan="4" valign="top" bgcolor="#666666"></td>
</tr>
<tr>
<td width="241" valign="top"><span class="style5"><strong>Name: <%=name%></strong></span></td>
<td width="90" valign="top"> <span class="style5"><strong>Dept: <%=dept%></strong></span></td>
<td width="323" valign="top"> <span class="style5"><strong>Date: <%=date%></strong></span> </td>
</tr>
<tr>
<td colspan="3" valign="top"> <span class="style1 style4"><strong>TYPE OF LEAVE: </strong></span>
<select name="mysel" onChange="change()">
<option value="Annual leave">Annual leave</option>
<option value="Sick leave">Sick leave</option>
<option value="Swap Saturday Leave">Swap Saturday Leave</option>
<option value="Compensation Leave">Compensation Leave</option>
<option value="Maternity Leave">Maternity Leave</option>
<option value="No Pay Leave">No Pay Leave</option>
<option value="Other">Other</option>
</select>
</td>
</tr>
<tr>
<td colspan="3" valign="top"> <div align="left"><span class="style1 style4"><strong>REASONS: </strong></span><strong>
<textarea name="reasons" cols="90" rows="5" onKeyDown="editTab()"></textarea>
</strong> </div></td>
</tr>
<tr>
<td colspan="3" valign="top"> <span class="style5">DURATION OF LEAVE:</span> </td>
</tr>
</table>
</div>
<div id="other">
<div align="center">
<table width="678" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td width="345" height="17" valign="top"><span class="style12"> More than one day :<input type=radio name="myclk" onClick=test() value="More than one day" checked>
</span></td>
<td width="333" valign="top" class="style4"> <span class="style12">Within one day :
<input type=radio name="myclk" onClick=test() value="Within one day">
</span></td>
</tr>
<tr>
<td height="1"></td>
<td></td>
</tr>
</table>
</div>
<div align="center" id=box1>
<table width="677" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="24" valign="top" class="style4"> <strong class="style12">From date:
<span class="style13"><strong class="style12">
<input name="fromdate" type="text" class=dstyle>
</strong></span></strong> </td>
<td valign="top" class="style4"> <strong class="style12">To date:
<input name="todate" type="text" class=dstyle></strong> </td>
</tr>
<tr>
<td height="21" valign="top" class="style4"> <strong class="style12">From date time:
<input name="fromtime1" type="text" class=tstyle onblur="checktime(this.value)" > </strong> </td>
<td valign="top" class="style4"> <strong class="style12">End date time:
<input name="totime1" type="text" class=tstyle onchange=" checktime(this.value)"> </strong> </td>
</tr>
</table>
</div>
<div align="center" id=box2>
<table width="677" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="24" colspan="2" valign="top" class="style4"> <strong class="style12"> <strong>Date: </strong>
<input name="date" type="text" class=dstyle></strong></td>
</tr>
<tr>
<td height="17" valign="top" class="style4"> <strong class="style12">From time:
<input name="fromtime2" type="text" size="26" onchange=" checktime(this.value)" class="tstyle"></strong> </td>
<td width="325" valign="top" class="style12">To time:
<input name="totime2" type="text" size="26" onchange=" checktime(this.value)"class="tstyle"> </td>
</tr>
</table>
</div>
</div>
<div align="center" id=swap>
<table width="677" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td width="349" height="17" valign="top" class="style4"> <strong class="style12">Original short week:
<input name="osw" type="text" size="20">
</strong> </td>
<td width="328" valign="top" class="style4"> <strong class="style12">Original long week:
<input name="olw" type="text" size="20"> </strong> </td>
</tr>
<tr>
<td height="17" valign="top" class="style4"> <strong class="style12">Now short week:
<input name="nsw" type="text" size="26"> </strong> </td>
<td valign="top" class="style4"> <strong class="style12">Now long week:
<input name="nlw" type="text" size="26"> </strong> </td>
</tr>
</table>
</div>
</form>
<div align="center">
<table width="677" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="17" valign="center" class="style4" align="center"> <strong class="style12">
<input name="submit" type="button" style="background-color:#000000;font-size:16px; color:#FFFFFF;width:70px;height:30px;" value=submit onClick="check()"> </strong> </td>
<td valign="center" class="style4" align="center"> <strong class="style12">
<input name="exit" type="button" style="background-color:#000000;font-size:16px; color:#FFFFFF;width:70px;height:30px;" value="exit" onclick="javascript: window.location='main.jsp'">
</strong></td>
</tr>
</table>
</div>
</body>
<script language="javascript">
function change() {
var list=document.frm.mysel;
if(list.options(list.selectedIndex).value=="Swap Saturday Leave"){
var visible=list.options(list.selectedIndex).value=="Swap Saturday Leave";
window.swap.style.display=(!visible?"none":"");
window.other.style.display=(visible?"none":"");
}
else{
var visible=true;
window.swap.style.display=(visible?"none":"");
window.other.style.display=(!visible?"none":"");
}
}
document.getElementById("mysel").checked=1;
change();
</script>
<script language="javascript">
function test() {
var visible=document.getElementById("myclk").checked
window.box1.style.display=(!visible?"none":"");
window.box2.style.display=(visible?"none":"");
}
document.getElementById("myclk").checked=1;
test();
</script>
<script type="text/javascript">
fm=document.frm;
var startindex;
var lastindex;
var total;
fr = document.all;
function check()
{fr = document.all;
if(window.other.style.display=="")
if(window.box1.style.display=="")
{
if(!(chkmoreday()&& checktime(fr.fromtime1.value)&& checktime(fr.totime1.value)))return;
}
else {
if(!(chkoneday()&& checktime(fr.fromtime2.value)&& checktime(fr.totime2.value)))return;
}
else {if(!chkswap())return;}
if(window.confirm("sure to submit?"))
fm.submit();
}
function chkmoreday(){
flag=true;
fr = document.all;
if(fr.fromdate.value=="")
{alert("FDate must be write");
fr.fromdate.focus();
flag=false;
return;
}
if(fr.todate.value=="")
{alert("TDate must be write");
fr.todate.focus();
flag=false;
return;
}
if(fr.fromdate.value!="")
if(!isdate(fr.fromdate.value))
{alert("The FDate Model is wrong! 'yyyy-mm-dd'");fr.fromdate.focus();flag=false;return}
if(fr.todate.value!="")
if(!isdate(fr.todate.value))
{alert("The TDate Model is wrong! 'yyyy-mm-dd'");fr.todate.focus();flag=false;return}
return(flag);
}
function chkoneday()
{ flag=true;
if(fr.date.value=="")
{alert("The Date must be write");
fr.date.focus();
flag=false;
return;
}
if(fr.date.value!="")
if(!isdate(fr.date.value))
{alert("The Date Model is wrong! 'yyyy-mm-dd'");fr.date.focus();flag=false;return}
return(flag);
}
function chkswap()
{ flag=true;
if(fr.osw.value=="")
{alert("The osw must be write");
fr.osw.focus();
flag=false;
return;
}
if(fr.olw.value=="")
{alert("The olw must be write");
fr.olw.focus();
flag=false;
return;
}
if(fr.nsw.value=="")
{alert("The nsw must be write");
fr.nsw.focus();
flag=false;
return;
}
if(fr.nlw.value=="")
{alert("The nsw must be write");
fr.nlw.focus();
flag=false;
return;
}
if(fr.osw.value!="")
if(!isdate(fr.osw.value))
{alert("The osw Date Model is wrong! 'yyyy-mm-dd'");fr.osw.focus();flag=false;return}
if(fr.nsw.value!="")
if(!isdate(fr.nsw.value))
{alert("The nsw Date Model is wrong! 'yyyy-mm-dd'");fr.nsw.focus();flag=false;return}
if(fr.olw.value!="")
if(!isdate(fr.olw.value))
{alert("The olw Date Model is wrong! 'yyyy-mm-dd'");fr.olw.focus();flag=false;return}
if(fr.nlw.value!="")
if(!isdate(fr.nlw.value))
{alert("The nlw Date Model is wrong! 'yyyy-mm-dd'");fr.nlw.focus();flag=false;return}
return(flag);
}
function isdate(sd2)
{var flag=true;
var sd=trim(sd2);
var re=/\d{4}-\d{1,2}-\d{1,2}/ig;
if(!re.test(sd))return(false);
var result =new Array();
result = sd.split('-');
var day;
var nonth;
var year;
var sum;
if(result.length==3)
{ year=parseInt(result[0],10);
month=parseInt(result[1],10);
day=parseInt(result[2],10);
var maxday;
if(isNaN(year) || isNaN(day))return(false);
switch(month)
{case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:maxday=31;if(day>maxday)flag=false;else break;
case 4: case 6:case 9:case 11:maxday=30;if(day>maxday)flag=false;else break;
case 2: if(year%4==0 && year%100!=0){maxday=29;}
else maxday=28;
if(day>maxday)
flag= false;
else break;
default:
flag=false;
}
}
else
{alert("input right date model");
flag= false;}
return(flag);
}
function checktime(stime)
{ flag=true;
if(stime=="")return(true);
if(stime!="")
{if(!chktimemod(trim(stime)))
{alert("The time model is--'hh:mm'or empty");
flag=false;return;}}
return (flag);
}
function chktimemod(st)
{flag=true;
var a=new Array();
a=st.split(':');
if(a.length==2)
{ var i=parseInt(a[0],10);
var j=parseInt(a[1],10);
if(isNaN(i)||isNaN(j))
return(false);
else{
if(i>24||i<0 ||j>=60||j<0)flag=false; }
}
else flag=false;
return(flag);
}
function trim(TheString)
{
var len;
len = TheString.length;
while(TheString.substring(0,1)==" "){ //trim left
TheString = TheString.substring(1, len);
len = TheString.length;
}
while(TheString.substring(len-1, len) == " "){ //trim right
TheString = TheString.substring(0, len-1);
len = TheString.length;
}
return TheString;
}
</script>[/code]
|