编程 Javascript

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

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小玩意几个属性相加不能超过一个特定值.

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JS上传图片前的限制包括(jpg jpg gif及大小高宽)等

Dec 19 Javascript

利用JS实现浏览器的title闪烁

Jul 08 Javascript

JavaScript数值转换的三种方式总结

Jul 31 Javascript

基于jQuery通过jQuery.form.js插件使用ajax提交form表单

Aug 17 Javascript

JavaScript的History API使搜索引擎抓取AJAX内容

Dec 07 Javascript

js实现年月日表单三级联动

Apr 17 Javascript

JavaScript 中的12种循环遍历方法【总结】

May 31 Javascript

Vue中的methods、watch、computed的区别

Nov 26 Javascript

详解vue中axios请求的封装

Apr 08 Javascript

Vue 利用指令实现禁止反复发送请求的两种方法

Sep 15 Javascript

Vuex实现数据增加和删除功能

Nov 11 Javascript

利用 JavaScript 实现并发控制的示例代码

Dec 31 Javascript

IE FF OPERA都可用的弹出层实现代码

Sep 29 #Javascript

javascript 表单验证常见正则

Sep 28 #Javascript

javascript 页面划词搜索JS

Sep 28 #Javascript

jquery 模式对话框终极版实现代码

Sep 28 #Javascript

javascript的onchange事件与jQuery的change()方法比较

Sep 28 #Javascript

支持ie与FireFox的剪切板操作代码

Sep 28 #Javascript

javaScript 简单验证代码（用户名，密码，邮箱)

Sep 28 #Javascript

You might like

在PHP中利用XML技术构造远程服务(上)

2006/10/09 PHP

ThinkPHP 防止表单重复提交的方法

2011/08/08 PHP

php中AES加密解密的例子小结

2014/02/18 PHP

YII CLinkPager分页类扩展增加显示共多少页

2016/01/29 PHP

ThinkPHP设置禁止百度等搜索引擎转码(简单实用)

2016/02/15 PHP

thinkPHP5框架中widget的功能与用法详解

2018/06/11 PHP

php查看一个变量的占用内存的实例代码

2020/03/29 PHP

使用JQuery和s3captche实现一个水果名字的验证

2009/08/14 Javascript

传智播客学习之JavaScript基础篇

2009/11/13 Javascript

从零开始学习jQuery (四) jQuery中操作元素的属性与样式

2011/02/23 Javascript

Javascript中的默认参数详解

2014/10/22 Javascript

jQuery控制cookie过期时间的方法

2015/04/07 Javascript

通过jquery-ui中的sortable来实现拖拽排序的简单实例

2016/05/24 Javascript

javascript运算符——位运算符全面介绍

2016/07/14 Javascript

vuejs通过filterBy、orderBy实现搜索筛选、降序排序数据

2020/10/26 Javascript

jQuery树控件zTree使用方法详解（一）

2017/02/28 Javascript

bootstrap3-dialog-master模态框使用详解

2017/08/22 Javascript

nodejs中art-template模板语法的引入及冲突解决方案

2017/11/07 NodeJs

Vue2.0学习之详解Vue 组件及父子组件通信

2017/12/12 Javascript

js+SVG实现动态时钟效果

2018/07/14 Javascript

jQuery实现的点击显示隐藏下拉菜单功能完整示例

2019/05/17 jQuery

vue路由插件之vue-route

2019/06/13 Javascript

布同 Python中文问题解决方法（总结了多位前人经验，初学者必看）

2011/03/13 Python

Django中模版的子目录与include标签的使用方法

2015/07/16 Python

Python有序查找算法之二分法实例分析

2017/12/11 Python

opencv-python 读取图像并转换颜色空间实例

2019/12/09 Python

python利用datetime模块计算程序运行时间问题

2020/02/20 Python

基于python实现复制文件并重命名

2020/09/16 Python

西班牙土拨鼠床垫公司，感觉在云端：Marmota

2019/03/18 全球购物

Java方面的关于数组和继承的笔面试题

2015/09/18 面试题

市场部专员岗位职责

2013/11/30 职场文书

医药营销个人求职信范文

2014/02/07 职场文书

《圆明园的毁灭》教学反思

2014/02/28 职场文书

领导干部查摆“四风”问题自我剖析材料思想汇报

2014/10/05 职场文书

css3实现背景图片颜色修改的多种方式

2021/04/13 HTML / CSS

go:垃圾回收GC触发条件详解

2021/04/24 Golang

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

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