javascript/HTML实现多个text控件自动/动态计算总数

最新推荐文章于 2022-11-15 21:36:48 发布

Mobidogs

最新推荐文章于 2022-11-15 21:36:48 发布

阅读量3.5k

点赞数

分类专栏： js/html/css技巧文章标签： input function javascript table html

本文链接：https://blog.csdn.net/Mobidogs/article/details/1674274

版权

这篇博客展示了如何使用JavaScript和HTML创建一个简单的表单，动态计算多个text输入框（text1, text2, text3）的数值总和。通过onkeyup事件和自定义函数autocalc，当用户在输入框中输入数字时，会实时更新total输入框的值。同时，EnsureDecimal函数用于限制输入只能为数字，防止输入非数字字符。" 122025139,5786159,Android Studio约束布局详解,"['Android开发', 'Android Studio', '布局设计', '约束布局', 'UI设计']

摘要由CSDN通过智能技术生成

<html>
<head>
<title>untitled</title>
<style type="text/css">

input {width: 40px;}

</style>
<script type="text/javascript" language="javascript">

function autocalc(e)
{
var field, val,total=0,i=0;
for (i; i< arguments.length; ++i) //loop through text elements
{
field = arguments[i];
val = parseFloat(field.value); //get value
if (!isNaN(val)) //number?
{
total += val; //accumulate
}

}
e.form.total.value = total; //out
}

function EnsureDecimal(e)
{
      if (((event.keyCode < 48) || (event.keyCode > 57)) && (event.keyCode != 46))
      {
         event.returnValue = false;
      }
      else if((e.value.indexOf('.')!=-1) && e