ASP多行表单 输入多个数字自动相加显示结果

原创 于 2022-08-06 11:54:00 发布 · 459 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript

这是一个使用JavaScript实现的功能，当在HTML表单中输入多个数字时，会自动相加并显示总分。表单包括姓名和三门学科（语文、数学、英语），每行输入完成后，对应的总分会即时更新。通过onChange事件触发AddToTotal函数，该函数获取每个输入框的值，转换为整数并累加，最后将结果更新到总分输入框中。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>成绩单</title>
</head>

<body>
<script language="JavaScript" type="text/javascript">
function AddToTotal(id1,id2,id3,id4)
{
 var o1 = document.getElementById(id1);
 var o2 = document.getElementById(id2);
 var o3 = document.getElementById(id3);
 var o4 = document.getElementById(id4);
 var total = 0;
 if ( o1.value != "" )
  total += parseInt(o1.value);
 if ( o2.value != "" )
  total += parseInt(o2.value);
 if ( o3.value != "" )
  total += parseInt(o3.value);
 o4.value = total;
}
</script>

<form name="form1" method="post" action="">
  <table width="800" border="0" cellspacing="0" cellpadding="5">
    <tr>
      <td>姓名</td>
      <td>语文</td>
      <td>数学</td>
      <td>英语</td>
      <td>总分</td>
    </tr>    <tr>
      <td width="45">A</td>
      <td width="182"><input name="Ya" type="text" id="Ya" onChange="AddToTotal('Ya','Sa','Ea','Ta')"></td>
      <td width="181"><input name="Sa" type="text" id="Sa" onChange="AddToTotal('Ya','Sa','Ea','Ta')"></td>
      <td width="195"><input name="Ea" type="text" id="Ea" onChange="AddToTotal('Ya','Sa','Ea','Ta')"></td>
      <td width="197"><input name="Ta" type="text" id="Ta" onChange="AddToTotal('Ya','Sa','Ea','Ta')"></td>
    </tr>
    <tr>
      <td>B</td>
      <td width="182"><input name="Yb" type="text" id="Yb" onChange="AddToTotal('Yb','Sb','Eb','Tb')"></td>
      <td width="181"><input name="Sb" type="text" id="Sb" onChange="AddToTotal('Yb','Sb','Eb','Tb')"></td>
      <td width="195"><input name="Eb" type="text" id="Eb" onChange="AddToTotal('Yb','Sb','Eb','Tb')"></td>
      <td width="197"><input name="Tb" type="text" id="Tb" onChange="AddToTotal('Yb','Sb','Eb','Tb')"></td>
    </tr>
    <tr>
      <td>C</td>
      <td width="182"><input name="Yc" type="text" id="Yc" onChange="AddToTotal('Yc','Sc','Ec','Tc')"></td>
      <td width="181"><input name="Sc" type="text" id="Sc" onChange="AddToTotal('Yc','Sc','Ec','Tc')"></td>
      <td width="195"><input name="Ec" type="text" id="Ec" onChange="AddToTotal('Yc','Sc','Ec','Tc')"></td>
      <td width="197"><input name="Tc" type="text" id="Tc" onChange="AddToTotal('Yc','Sc','Ec','Tc')"></td>
    </tr>
  </table>
</form>
</body>
</html>

远方的文
关注
软件测试 Web自动化测试 基础知识 HTML CSS JavaScript
qq_740785701的博客
04-02 4141
html,css,js
JavaWeb全套教程笔记_前端技术
weixin_46040278的博客
05-15 1466
本系列笔记仅作为JavaWeb阶段学习参考,不光记一定要上手实践操作
asp.net两数相加的程序
07-23
asp.net两数相加的程序
ajax form 提交 动态显示
04-16
ajax form 提交 动态显示ajax form 提交 动态显示ajax form 提交 动态显示
asp数字 字符串转换及相加
aaa117659928的专栏
09-15 2064
&lt;% '更新用户余额 dim xinjine xinjine=cint(zcje) + cint(jinee) sql="select top 1 id,zcdj,zcje,zcmc,zcmm,zcqq,zcrq,zcsj,zctx,zcwx,zczt from zc Where 1=1 And id = " &amp; usid &amp; "  order by id asc" Set ...
Asp 多行表单，每行输入数据后自动计算结果
weixin_30364147的博客
09-21 556
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title></head><body><script language="JavaScript" type="text...
VS2008实现文本框字符串相加的源代码示例
在编程中，字符串相加通常指的是字符串连接，即将两个或多个字符串首尾相接形成一个新的字符串。不同的编程语言实现字符串连接的方式可能不同。例如，在C#中，可以通过加号运算符（+）来连接两个字符串。字符串相加...
一些一页纸的总结
06-26
- **DateAdd**: 返回日期与时间间隔相加的结果。 - **DatePart**: 返回日期的时间部分。 - **DateSerial**: 根据年月日返回日期。 - **Day**: 返回日期中的天数。 - **FormatDateTime**: 格式化日期和时间。 -...
超级完整的JS学习笔记整理2020版本
qq_31687191的博客
03-11 573
一、javaScript是什么? JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。 二、javaScript能干什么 可以写一些效果，网页增加色彩 表单验证 … 三、javaS...
ASP生成数字相加求和的BMP图片验证码
10-30
以前我自己写了个是文字的，但还是这个好，都是图片的
加减乘除（ASP网页）
12-19
对于初学编程语言的你，我想这个很有帮助。
改进的asp操作EXCEL输入输出类，支持表格画线及格式输出
07-11
改进的asp操作EXCEL输入输出类，支持表格画线及格式输出
LeetCode 258 Add Digits（数字相加，数字根）
weixin_33681778的博客
12-24 195
翻译 给定一个非负整型数字，重复相加其所有的数字直到最后的结果只有一位数。 例如： 给定sum = 38，这个过程就像是：3 + 8 = 11，1 + 1 = 2，因为2只有一位数，所以返回它。 紧接着： 你可以不用循环或递归在O(1)时间内完成它吗？ 原文 Given a non-negative integer...
ASP表单输入到HTML
ASP2014的专栏
11-24 737
ASP能写.html或者任何其他的直接到web服务器的文档文本（你需要写文本输出到写权限的目录）。这是能够不需要上传PC的文件用户输入即时的发布信息。 下面的例子有四个输入区域（标题{要求的}），字号。段落1和段落2）。从这些输入的值里，一个文本对象会被创建有.html的服务器上（仅仅是和像.asp，.inc，.txt，.html一样容易的）从用户输入的破折号和当前日期的扩展名。其他的出入会被写
在两个文本框中输入日期数据后，第三个文本框能够自动计算出两个日期之间的天数
whx_1113的专栏
11-29 5273
<br />在两个文本框中输入日期数据后，第三个文本框能够自动计算出两个日期之间的天数<br />前台代码如下：<br /><tr><br />    <td class="style1">合同开工日期：</td><br />    <td class="style3" ><br />    <asp:TextBox ID="htkgrq" runat="server"  AutoPostBack="True"ontextchanged="htkgrq_TextChanged"></asp:TextBox>
leetcode-2. 两数相加
GrinAndBearIt的博客
08-07 322
一、问题描述 给定两个非空链表来表示两个非负整数。位数按照逆序方式存储，它们的每个节点只存储单个数字。将两数相加返回一个新的链表。 你可以假设除了数字 0 之外，这两个数字都不会以零开头。 示例： 输入：(2 -&gt; 4 -&gt; 3) + (5 -&gt; 6 -&gt; 4) 输出：7 -&gt; 0 -&gt; 8 原因：342 + 465 = 807 二、代码和思路 方...
0.1+0.2 为什么不等于0.3
热门推荐
cherryfef的博客
11-22 1万+
0.1+0.2的计算过程 1、十进制转成二进制 在JS内部所有的计算都是以二进制方式计算的。所以运算 0.1+ 0.2 时要先把 0.1和 0.2 从十进制转成二进制。 0.1转化成二进制的算法： 0.1*2=0.2======取出整数部分0 0.2*2=0.4======取出整数部分0 0.4*2=0.8======取出整数部分0 0.8*2=1.6======取出整数部分1 0.6*2=1.2======取出整数部分1 接下来会无限循环 0.2*2=0.4======取出整数部分..
asp网页生成excel 多sheet_2分钟搞定excel多sheet汇总，表头顺序不一样也能汇总，堪称神奇...
weixin_32042959的博客
12-25 492
hello，大家好，在日常工作中我觉得最令我们抓狂，也是最让人害怕的excel工作莫过于数据汇总了，当汇总的表格数量比较多，表格的格式又不统一的时候，加班到深夜都有可能，今天就跟大家分享一种多sheet汇总的方法，即使表头的顺序不一致也能汇总数据，堪称数据汇总神奇，话不多说，让我们直接开始吧多sheet汇总我们用到的工具书power query，先来看下我们的数据，在这里我们要汇总2年的数据，一共...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值