一个JS小玩意几个属性相加不能超过一个特定值.

最有名的例子就是三国志和太阁里给新武将角色分配属性值啦. 在下不才,用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; } 三个文件放在同一文件夹下,然后试试效果,我肯定没骗你.

　　推荐阅读

　　jquery 最简单的属性菜单

1.0 创建 <UL> 菜单树！并影藏子选项！ 2.0 加入！复制代码代码如下: $("li:has(ul)").click( function (){$(this).children("ul").css("display")=='none'?$(this).children("ul").show("slow"):$(this).chil>>>详细阅读

本文标题：一个JS小玩意几个属性相加不能超过一个特定值.

地址：http://www.17bianji.com/kaifa2/JS/28033.html

1/2 1

一个JS小玩意 几个属性相加不能超过一个特定值.

一个JS小玩意几个属性相加不能超过一个特定值.