customer.js:
/**
* @author fuhao
* @param {Object} tbodyid
* 首先在Html页面上定义一个标准的table模板
* table的子节点是tbody
* tbody的子节点是tr
* tr的子节点是td
* td的子节点是checkbox和input
*/
// 以table模板为标准,添加新的行的方法
function add(tbodyid){
if(tbodyid==null){
alert("该方法需要的参数不正确");
return ;
}
// 得到tbody,也可以使用prototype.js里面的$(tbodyid)
var tbody = document.getElementById(tbodyid);
// var tbody = $(tbodyid);
// 获得tbody下的索引为1的tr
var trtemplate = tbody.childNodes[1];
// 得到tr下的td数组
var tds = trtemplate.childNodes;
// 得到该tr下所有td数组的长度
var trlength = tds.length;
var tr = document.createElement("tr");
for(var i=0;i<trlength;i++){
var td = document.createElement("td");
// 设置td的式样标记
td.className = tds[i].className;
var content = tds[i].innerHTML;
td.innerHTML = content;
tr.appendChild(td);
}
tbody.appendChild(tr);
}
// 删除选中行的方法
function del(name){
if(name==null){
alert("该方法需要的参数不正确");
return ;
}
// 获得数组
var names = document.getElementsByName(name);
// 获得数组的长度
var length = names.length;
if(length==1){
alert("请至少保留一条记录");
return ;
}
// 定义一个数组
var arr = new Array();
try{
for(var i=0;i<length;i++){
if(names[i].checked==true){
// 将checkbox的父节点(td)的父节点(tr)放入数组里面
arr.push(names[i].parentNode.parentNode);
}
}
}catch(e){
alert("捕获到的异常是:"+e);
}
if(arr.length==0){
alert("请至少选择一条删除");
return ;
}
var delsure = confirm("确认要删除所选记录吗?");
if(!delsure){
return ;
}
for(var j=0;j<arr.length;j++){
if(arr.length == length){
alert("请至少保留一条记录");
return ;
}
Element.remove(arr[j]);
}
}
// 敲回车,则添加新的一行
function addItem(tbodyid){
// 13代表回车
if(event.keyCode==13){
add(tbodyid);
}
}
// 全部选择
function checkAll(name){
// 首先获得所有checkbox集合
var names = document.getElementsByName(name);
for(var i=0;i<names.length;i++){
names[i].checked=true;
}
}
// 取消选择--反选
function cancelCheck(name){
var names = document.getElementsByName(name);
var length = names.length;
for(var i=0;i<length;i++){
if(names[i].checked){
names[i].checked = false;
}else{
names[i].checked = true;
}
}
}
//用于自动补0的方法 如:5--5.00,5.5--5.50
function mend(number){
var str = number+"";
if (str.indexOf(".")==-1){ //说明没有小数点
return str+".00";
}else{ //说明有小数点
var tmp = str.substring(str.indexOf(".")+1);
if (tmp.length==0) return str+"00";
if (tmp.length==1) return str+"0";
if (tmp.length>=2) return str.substring(0,str.indexOf(".")+3);
}
}
//用于四舍五入的方法
function ForDight(Dight,How) {
Dight = Math.round(Dight*Math.pow(10,How))/Math.pow(10,How);
return mend(Dight);
}
// 计算(这里以数量作为参照物)
function calc(obj){
// obj.parentElement获取对象层次中的父对象
var td = obj.parentElement;
var tr = td.parentElement;
var numbers = tr.childNodes[4].childNodes[0].value; // 数量
//alert("numbers:"+numbers);
var faceValue = tr.childNodes[2].childNodes[0].value; //面值
//alert("faceValue:"+faceValue);
var additionValue = tr.childNodes[3].childNodes[0].value; //附赠
//alert("additionValue:"+additionValue);
//判断为空或者不为数字
if(numbers=="" || faceValue=="" || additionValue=="" || isNaN(numbers) || isNaN(faceValue) || isNaN(additionValue)){
// alert("--你的输入有误,数量为非空正整数,面值和附赠应为非空正数--");
tr.childNodes[5].childNodes[0].value = "";
tr.childNodes[6].childNodes[0].value = "";
tr.childNodes[7].childNodes[0].value = "";
return ;
}
//判断是否小于零或者数量为整数
if(numbers<=0*1 || faceValue<=0*1 || additionValue<=0*1 || numbers.indexOf(".")!=-1){
// alert("--你的输入有误,数量为非空正整数,面值和附赠应为非空正数--");
tr.childNodes[5].childNodes[0].value = "";
tr.childNodes[6].childNodes[0].value = "";
tr.childNodes[7].childNodes[0].value = "";
return ;
}
var faceValues = numbers*faceValue; //面值金额
var additionValues = numbers*additionValue;//附赠金额
var faceValueAll = faceValues+additionValues; //面值总额
// 赋值
tr.childNodes[5].childNodes[0].value = ForDight(faceValues,2);
tr.childNodes[6].childNodes[0].value = ForDight(additionValues,2);
tr.childNodes[7].childNodes[0].value = ForDight(faceValueAll,2);
}
function calcs(obj){
// obj.parentElement获取对象层次中的父对象
var td = obj.parentElement;
var tr = td.parentElement;
var numbers = tr.childNodes[4].childNodes[0].value; // 数量
var price = tr.childNodes[8].childNodes[0].value; //单价
var agio = tr.childNodes[9].childNodes[0].value; //折扣
if(numbers=="" || price=="" || isNaN(numbers) || isNaN(price) || isNaN(agio)){
alert("--------");
tr.childNodes[10].childNodes[0].value = "";
return ;
}
if(numbers<=0*1 || numbers.indexOf(".")!=-1 || price<=0*1 || agio<=0*1 || agio>10){
alert("++++++++");
tr.childNodes[10].childNodes[0].value = "";
return ;
}
var factValues ;
if(agio==""){//说明没有填写折扣
alert("--说明没有填写折扣--");
factValues = price*numbers;
alert("factValue1:"+factValues);
}else{
alert("--说明填写折扣了--");
factValues = price*numbers*agio;
alert("factValue2:"+factValues);
}
alert("factValue3:"+factValues);
tr.childNodes[10].childNodes[0].value = ForDight(factValues,2);
}
calc.htm:
引用
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JavaScript例子</title>
<script src="js/customer.js"></script>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<a href="#" onclick="add('DispatchItemTable')">增加</a>
<a href="#" onclick="del('checkName')">删除</a>
<a href="#" onclick="checkAll('checkName')">全选</a>
<a href="#" onclick="cancelCheck('checkName')">反选</a> 面值金额=面值*数量 附赠金额=附赠*数量 
面值总额=面值金额+附赠金额 实收金额=单价*数量*折扣
</p>
<table id="table" align='center' border='1' bordercolor='#0690AE' cellpadding='0' cellspacing='0' style='border-collapse:collapse;' width='100%'>
<tbody id="DispatchItemTable">
<tr>
<td nowrap class='data_list_th'>序号</td>
<td class='data_list_th'>卡名称</td>
<td class='data_list_th'><font color="red">*</font>面值(元)</td>
<td class='data_list_th'><font color="red">*</font>附赠(元)</td>
<td class='data_list_th'><font color="red">*</font>数量(枚)</td>
<td class='data_list_th'>面值金额(元)</td>
<td class='data_list_th'>附赠金额(元)</td>
<td class='data_list_th'>面值总额(元)</td>
<td class='data_list_th'><font color="red">*</font>单价(元)</td>
<td class='data_list_th'><font color="red">*</font>折扣</td>
<td class='data_list_th'>实收金额(元)</td>
</tr>
<tr id="testc">
<td class='data_list_td'><input type="checkbox" name="checkName" /></td>
<td class='data_list_td'><input name="cardName" type="text" size="12" value="IC卡" readonly="true" onkeydown="addItem('DispatchItemTable')" /></td>
<td class='data_list_td'><input name="faceValue" type="text" size="12" onchange="calc(this);calcs(this)" /></td>
<td class='data_list_td'><input name="additionValue" type="text" size="12" onchange="calc(this)" /></td>
<td class='data_list_td'><input name="cardNumber" type="text" size="12" onchange="calc(this)" /></td>
<td class='data_list_td'><input type="text" name="faceValues" size="12" readonly="true" /></td>
<td class='data_list_td'><input type="text" name="additionValues" size="12" readonly="true" /></td>
<td class='data_list_td'><input type="text" name="faceValuesAll" size="12" readonly="true" /></td>
<td class='data_list_td'><input type="text" name="price" size="12" onchange="calcs(this)" /></td>
<td class='data_list_td'><input type="text" name="agios" size="12" onchange="calcs(this)" /></td>
<td class='data_list_td'><input type="text" name="factValue" size="12" readonly="true" /></td>
</tr>
</tbody>
</table>
<p> </p>
</body>
</html>
分享到:
相关推荐
7.3.4 字符串单词数的计算函数—— 7.3.4 str_word_count 107 7.3.5 字符串查找操作——strstr 108 7.3.6 获得字符串的长度——strlen 108 7.3.7 获得字符串的子串——substr 109 7.4 正则表达式简介 109 7.5 正则...
使个人计算机在 大规模的计算并实时显示复杂的图形成为可能! 推荐资源 代码高亮工具 -- firefox 附加组件 100个Visual C++网络与数据库编程例子 net人才系统msSql2000数据库 accp s2 结业项目(包含项目答辩PPT,...
————— 一开始是一堆JavaScript文件的编码,以了解如何线性方程组和矩阵可以数字表示,lnagb.js(L I N耳朵L G E B RA点JS),现在已经演变成一个学习环境,数学和计算机科学学生都可以来学习线性代数以及如何...
一个XSLT的简单例子 XSLXSLT板主题整理 xsl入门的好文章 新手学习XSL的好东西 XSL语法介绍 XSL学习心得 - 调用属性值 XSLT与XML转换的详细介绍 功能应用 读写搜索 基础教程 RSS Web2.0时代,RSS你会用了吗?(技术...
例子: 一种乙C 结果5 2 2 + -2 -2 1 + -2 4 3 —— 0 -2.5 4 0 -1 -0.5 -5.1 ——问题 3. 三个中最大的一个编写一个脚本,找出三个数字中最大的一个。 使用嵌套的if语句。 例子: 一种乙C 最大5 2 2 5 -2 -2 1 1 -...
最重要的是——请给我30分钟,如果你没有使用正则表达式的经验,请不要试图在30秒内入门——除非你是超人 :) 别被下面那些复杂的表达式吓倒,只要跟着我一步一步来,你会发现正则表达式其实并没有你想像中的那么困难...
此外,本书还讨论了各种与面向对象概念密切相关的应用主题,包括XML、UML建模语言、持久存储、分布式计算和客户/服务器技术等。 本书内容精炼,示例简单明了,适合各层次面向对象开发人员阅读,也是高校相关专业...
·作为自动化测试的出发点,通过使用秘诀中的脚本和例子,使你的测试可重复 不用再担心午夜来电话告诉你站点被破坏了。通过本书和示例中所用的免费工具,你可以将安全因素加入到你的测试套装中,从而得以睡个...
- 周一课的例子 - 周三课程的项目 - 分配的基础(周三项目的更发达版本) - 分配的基础以及注释中的工作位置指南 ——关于保持 UI state分开的图表和注释,并使用render方法更新用户看到的内容 克隆这个存储库 ...
实例038 动态输出JavaScript代码 69 实例039 当数字遇到了字符串 70 实例040 PHP程序员的基础——变量的应用 72 实例041 打印系统环境变量信息print_r($_ENV) 73 实例042 使用可变变量输出“I Like PHP!” 73 实例...
实例038 动态输出JavaScript代码 69 实例039 当数字遇到了字符串 70 实例040 PHP程序员的基础——变量的应用 72 实例041 打印系统环境变量信息print_r($_ENV) 73 实例042 使用可变变量输出“I Like PHP!” 73 实例...
Java EJB中有、无状态SessionBean的两个例子 两个例子,无状态SessionBean可会话Bean必须实现SessionBean,获取系统属性,初始化JNDI,取得Home对象的引用,创建EJB对象,计算利息等;在有状态SessionBean中,用...
8.LOAD FAIL——Save defaults 恢复出厂设置 11 第二章 分区软件的应用 12 1.PQ魔术分区:首先用GHOST安装光盘引导起计算机,选择PQ分区进入工作界面。 12 2.DM分区的应用:首先用GHOST安装光盘引导起计算机,...
9.1. JavaScript 9.2. 符号表 9.3. 语素 9.4. 优先级 9.5. 表达式 9.6. 中置运算符 9.7. 前置操作符 9.8. 赋值运算符 9.9. 常数 9.10. Scope 9.11. 语句 9.12. 函数 9.13. 数组和对象字面量 9.14. 要做和要思考的事 ...
两个例子,无状态SessionBean可会话Bean必须实现SessionBean,获取系统属性,初始化JNDI,取得Home对象的引用,创建EJB对象,计算利息等;在有状态SessionBean中,用累加器,以对话状态存储起来,创建EJB对象,并将...
两个例子,无状态SessionBean可会话Bean必须实现SessionBean,获取系统属性,初始化JNDI,取得Home对象的引用,创建EJB对象,计算利息等;在有状态SessionBean中,用累加器,以对话状态存储起来,创建EJB对象,并将...