一個JS小玩意 幾個屬性相加不能超過一個特定值.
更新時間:2009年09月29日 22:53:48 作者:
以前玩游戲,有給玩家角色分配什么魔法點數(shù),體力點數(shù)的功能,而且?guī)讉€屬性相加不能超過一個特定值.
最有名的例子就是三國志和太閣里給新武將角色分配屬性值啦.
在下不才,用javascript做了這么一個功能,順便把頁面中的鏈接下劃線給隱藏掉.
大家看看,有什么更好的優(yōu)化意見,大家盡管提.
下面是代碼:
首先是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>
還有l(wèi)ink.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("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.username.value =10-parseInt(formname.meili.value);
return false;
}else
return true;
}else{
alert("輸入的整數(shù)必須大于0");
formname.username.value =1;
return false;
}
}
function subtration(formname){
if (formname.username.value == "") {
alert("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.username.value =10-parseInt(formname.meili.value);
return false;
}else
return true;
}else if(parseInt(formname.username.value) ==1){
alert("已經(jīng)是最小值,不能再減了");
return false;
}else{
alert("輸入的整數(shù)必須大于1");
formname.username.value =1;
return false;
}
}
function add2(formname){
if (formname.meili.value == "") {
alert("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.meili.value =10-parseInt(formname.username.value);
return false;
}else
return true;
}else{
alert("輸入的整數(shù)必須大于0");
formname.meili.value=1;
return false;
}
}
function subtration2(formname){
if (formname.meili.value == "") {
alert("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.meili.value =10-parseInt(formname.username.value);
return false;
}else
return true;
}else if(parseInt(formname.meili.value) ==1){
alert("已經(jīng)是最小值,不能再減了");
return false;
}else{
alert("輸入的整數(shù)必須大于1");
formname.meili.value=1;
return false;
}
}
function checkscope(formname){
if((parseInt(formname.username.value)>9)||(parseInt(formname.username.value)<1)){
alert("username輸入數(shù)字超出允許的范圍1-9");
formname.username.value=1;
formname.username.focus();
return false;
}
if((parseInt(formname.meili.value)>9)||(parseInt(formname.meili.value)<1)){
alert("meili輸入數(shù)字超出允許的范圍1-9");
formname.meili.value=1;
formname.meili.focus();
return false;
}
return true;
}
三個文件放在同一文件夾下,然后試試效果,我肯定沒騙你.
在下不才,用javascript做了這么一個功能,順便把頁面中的鏈接下劃線給隱藏掉.
大家看看,有什么更好的優(yōu)化意見,大家盡管提.
下面是代碼:
首先是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>
還有l(wèi)ink.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("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.username.value =10-parseInt(formname.meili.value);
return false;
}else
return true;
}else{
alert("輸入的整數(shù)必須大于0");
formname.username.value =1;
return false;
}
}
function subtration(formname){
if (formname.username.value == "") {
alert("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.username.value =10-parseInt(formname.meili.value);
return false;
}else
return true;
}else if(parseInt(formname.username.value) ==1){
alert("已經(jīng)是最小值,不能再減了");
return false;
}else{
alert("輸入的整數(shù)必須大于1");
formname.username.value =1;
return false;
}
}
function add2(formname){
if (formname.meili.value == "") {
alert("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.meili.value =10-parseInt(formname.username.value);
return false;
}else
return true;
}else{
alert("輸入的整數(shù)必須大于0");
formname.meili.value=1;
return false;
}
}
function subtration2(formname){
if (formname.meili.value == "") {
alert("請輸入一個正整數(shù)");
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("輸入的整數(shù)之和不得大于10");
formname.meili.value =10-parseInt(formname.username.value);
return false;
}else
return true;
}else if(parseInt(formname.meili.value) ==1){
alert("已經(jīng)是最小值,不能再減了");
return false;
}else{
alert("輸入的整數(shù)必須大于1");
formname.meili.value=1;
return false;
}
}
function checkscope(formname){
if((parseInt(formname.username.value)>9)||(parseInt(formname.username.value)<1)){
alert("username輸入數(shù)字超出允許的范圍1-9");
formname.username.value=1;
formname.username.focus();
return false;
}
if((parseInt(formname.meili.value)>9)||(parseInt(formname.meili.value)<1)){
alert("meili輸入數(shù)字超出允許的范圍1-9");
formname.meili.value=1;
formname.meili.focus();
return false;
}
return true;
}
三個文件放在同一文件夾下,然后試試效果,我肯定沒騙你.
相關(guān)文章
js Object2String方便查看js對象內(nèi)容
這篇文章主要介紹了將JS的任意對象輸出為json格式字符串的方法,需要的朋友可以參考下2014-11-11