Posted in Javascript onSeptember 29, 2009
最有名的例子就是三国志和太阁里给新武将角色分配属性值啦.
在下不才,用javascript做了这么一个功能,顺便把页面中的链接下划线给隐藏掉.
大家看看,有什么更好的优化意见,大家尽管提.
下面是代码:
首先是test.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script language="JavaScript" src="util.js" type="text/JavaScript"></script> <link rel="stylesheet" href="link.css" type="text/css"> </HEAD> <BODY > <form name="Register1Form" method="POST" > <table> <tr> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="font1"><div align="right">username</div></td> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="font1"> <div align="center"> <input name="username" type="text" size="10" maxlength="10" value="1"> </div></td> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="bg2"> <div align="center"><font color="#FF0000"><font color="#FF0000"><font face="黑体"><a href="" onclick="javascript:add(Register1Form);return false;" class="A">+</a></font></font></font></div& gt;</td> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="bg2"> <div align="center"><font color="#FF0000"><font color="#FF0000"><font face="黑体"><a href="" onclick="javascript:subtration(Register1Form);return false;" class="A">-</a></font></font></font></div& gt;</td> </tr> <tr> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="font1"><div align="right">meili</div></td> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="font1"> <div align="center"> <input name="meili" type="text" size="10" maxlength="10" value="1"> </div></td> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="bg2"> <div align="center"><font color="#FF0000"><font color="#FF0000"><font face="黑体"><a href="" onclick="javascript:add2(Register1Form);return false;" class="A">+</a></font></font></font></div& gt;</td> <td height="30" bordercolor="#FFFFFF" bgcolor="#D0E8FF" class="bg2"> <div align="center"><font color="#FF0000"><font color="#FF0000"><font face="黑体"><a href="" onclick="javascript:subtration2(Register1Form);return false;" class="A">-</a></font></font></font></div& gt;</td> </tr> </table> </form> </body> </html>
还有link.css:
.A { text-transform: none; text-decoration: none; } .a:hover { text-decoration: underline }
最后是util.js(这个代码比较长了):
var flag=false; function add(formname){ if (formname.username.value == "") { alert("请输入一个正整数"); formname.username.focus(); return false; } flag = checkscope(formname); if(flag==false){ return false; } if( parseInt(formname.username.value)>0){ formname.username.value =parseInt(formname.username.value)+1; if(parseInt(formname.username.value)+parseInt(formname.meili.value)>10){ alert("输入的整数之和不得大于10"); formname.username.value =10-parseInt(formname.meili.value); return false; }else return true; }else{ alert("输入的整数必须大于0"); formname.username.value =1; return false; } } function subtration(formname){ if (formname.username.value == "") { alert("请输入一个正整数"); formname.username.focus(); return false; } flag = checkscope(formname); if(flag==false){ return false; } if( parseInt(formname.username.value)>1){ formname.username.value =parseInt(formname.username.value)-1; if(parseInt(formname.username.value)+parseInt(formname.meili.value)>10){ alert("输入的整数之和不得大于10"); formname.username.value =10-parseInt(formname.meili.value); return false; }else return true; }else if(parseInt(formname.username.value) ==1){ alert("已经是最小值,不能再减了"); return false; }else{ alert("输入的整数必须大于1"); formname.username.value =1; return false; } } function add2(formname){ if (formname.meili.value == "") { alert("请输入一个正整数"); formname.meili.focus(); return false; } flag = checkscope(formname); if(flag==false){ return false; } if( parseInt(formname.meili.value)>0){ formname.meili.value =parseInt(formname.meili.value)+1; if(parseInt(formname.username.value)+parseInt(formname.meili.value)>10){ alert("输入的整数之和不得大于10"); formname.meili.value =10-parseInt(formname.username.value); return false; }else return true; }else{ alert("输入的整数必须大于0"); formname.meili.value=1; return false; } } function subtration2(formname){ if (formname.meili.value == "") { alert("请输入一个正整数"); formname.meili.focus(); return false; } flag = checkscope(formname); if(flag==false){ return false; } if( parseInt(formname.meili.value)>1){ formname.meili.value =parseInt(formname.meili.value)-1; if(parseInt(formname.username.value)+parseInt(formname.meili.value)>10){ alert("输入的整数之和不得大于10"); formname.meili.value =10-parseInt(formname.username.value); return false; }else return true; }else if(parseInt(formname.meili.value) ==1){ alert("已经是最小值,不能再减了"); return false; }else{ alert("输入的整数必须大于1"); formname.meili.value=1; return false; } } function checkscope(formname){ if((parseInt(formname.username.value)>9)||(parseInt(formname.username.value)<1)){ alert("username输入数字超出允许的范围1-9"); formname.username.value=1; formname.username.focus(); return false; } if((parseInt(formname.meili.value)>9)||(parseInt(formname.meili.value)<1)){ alert("meili输入数字超出允许的范围1-9"); formname.meili.value=1; formname.meili.focus(); return false; } return true; }
三个文件放在同一文件夹下,然后试试效果,我肯定没骗你.
一个JS小玩意 几个属性相加不能超过一个特定值.
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@