`
wang_zhi_peng2007
  • 浏览: 251822 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JS自动计算表单金额

 
阅读更多

JS自动计算表单金额

        js实现自动计算表单项中的金额,自动汇总数值,用户无需再次计算,在点击提交前就已经计算出数值并显示在文本框中,若要使用本效果,请添加一个表单输入判断,这样可避免程序出错,提升用户体验。

<!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>自动计算金额</title>
<script type="text/javascript">
function count(){
  var amount,price,money;
  amount=document.form1.txt_year.value;
  price=document.form1.txt_by.value;
  money=amount*price;
  document.form1.txt_bail.value=money;
}
</script>
</head>
<body style="font-size:12px">
<table width="785" height="508" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="193" height="175">&nbsp;</td>
    <td width="592" height="175">&nbsp;</td>
  </tr>
  <tr>
    <td height="202">&nbsp;</td>
    <td align="center" valign="middle" height="202"><table width="90%"  border="0" cellspacing="1" cellpadding="1">
      <form name="form1">
        <tr>
          <td height="22" colspan="2" align="center">加盟商信息</td>
        </tr>
        <tr>
          <td width="150" height="22" align="right">签订金额:</td>
          <td height="22" align="left"><input name="txt_money" type="text" id="txt_money2"></td>
        </tr>
        <tr>
          <td height="22" align="right">签订日期:</td>
          <td height="22" align="left"><input name="txt_date" type="text" id="txt_date"></td>
        </tr>
        <tr>
          <td height="22" align="right">合同年限:</td>
          <td height="22" align="left"><input name="txt_year" type="text" id="txt_year" size="10" onBlur="count()">
        年
          <input name="txt_by" type="hidden" id="txt_by" value="2000"></td>
        </tr>
        <tr>
          <td height="22" align="right">保证金:</td>
          <td height="22" align="left"><input name="txt_bail" type="text" id="txt_bail" readonly="true"></td>
        </tr>
        <tr>
          <td width="150" height="32" align="right">&nbsp;</td>
          <td height="22" align="left"><input type="submit" name="Submit3" value="  签订合同  ">
              
&nbsp;&nbsp;
        <input type="reset" name="Submit4" value="  重置内容  "></td>
        </tr>
      </form>
    </table></td>
  </tr>
  <tr>
    <td height="131">&nbsp;</td>
    <td height="131">&nbsp;</td>
  </tr>
</table>
</body>
</html>

 

 

 

  • 大小: 13.7 KB
分享到:
评论

相关推荐

    车自动计算金额表单.rar_CUM 计算金额_chargeszn_车自动计算金额表单

    "车自动计算金额表单"就是这样一个功能,通过巧妙运用JavaScript库jQuery来实现这一目标。在本文中,我们将深入探讨这一技术实现的细节,以及如何通过"chargeszn"这一特定的计算方法来优化整个过程。 首先,jQuery...

    输入数量和价格自动计算输出金额的js代码

    标题中提到的是使用JavaScript编写一段代码,该代码的功能是接收用户输入的数量和价格信息,然后自动计算并输出相应的总金额。这个知识点涉及到了前端JavaScript编程、用户输入交互以及简单的算术运算。 在描述部分...

    jQuery购物车自动计算金额表单

    【jQuery购物车自动计算金额表单】是一个基于jQuery技术实现的简单购物车功能,它能够自动计算用户在购物车中选择商品的总价。这个功能在电商网站中非常常见,为用户提供了一个直观的方式来查看他们所选商品的总价值...

    jQuery购物车自动计算金额表单多数据加减商城购物结算

    在这个主题中,"jQuery购物车自动计算金额表单多数据加减商城购物结算"涉及到的核心知识点主要包括jQuery库的使用、动态计算、表单处理以及多数据管理。 首先,jQuery是一个广泛使用的JavaScript库,它简化了DOM...

    jQuery购物车自动计算金额表单.zip

    "jQuery购物车自动计算金额表单"是一个实现这一功能的JavaScript库,尤其适用于在线商城的结算过程。这个库利用jQuery的强大功能,为用户提供了一种便捷的方式来动态计算购物车内商品的总价,提升用户体验。 首先,...

    Js自动计算(平均分配)例子

    在给定的“Js自动计算(平均分配)例子”中,我们关注的是一个JavaScript功能,该功能允许用户输入一系列数值,并自动计算这些数值的平均值,确保最后一个输入的值保持不变,然后将剩余的值平均分配到其他输入项中。...

    jQuery购物车自动计算金额表单适应于商城购物结算.zip

    "jQuery购物车自动计算金额表单适应于商城购物结算.zip" 文件提供了一个使用jQuery实现的购物车结算功能,适用于各种类型的在线商城系统。以下将详细介绍这个功能及其相关的jQuery知识点。 jQuery是一个轻量级、高...

    jQuery购物车自动计算金额表单特效代码

    "jQuery购物车自动计算金额表单特效代码"是一个实用的解决方案,旨在简化这个过程,为用户提供流畅的购物体验。这个代码利用了jQuery库的强大功能,实现了动态计算购物车中商品的总价格,并在用户添加或移除商品时...

    js GridView 实现自动计算操作代码

    接下来,我们将分别探讨在文档中提到的几个关键知识点:如何利用JS操作GridView实现自动计算、如何处理与表单元素交互时的数据验证问题以及如何使用jQuery来简化DOM操作。 1. **GridView组件的自动计算实现**: - ...

    jQuery实现购物车表单自动结算效果实例

    自动结算意味着用户无需提交表单,便能在页面上实时看到自己添加商品后的总金额、运费以及最终需要支付的金额。本文通过实例详细说明了如何使用jQuery来实现一个购物车表单的自动结算效果。 首先,需要对jQuery有一...

    小费计算器1:HTML,CSS,JavaScript应用程序,用于计算小费金额。 用户输入账单金额,选择服务方式以及共享账单的人数。 该应用程序根据输入的值生成所需的美元金额

    3. script.js:JavaScript文件,包含了所有计算逻辑和事件监听代码。 4. 可能还有其他辅助文件,如图片或图标,用于增强用户体验。 这个小费计算器实例是学习前端开发的好素材,因为它涵盖了Web开发的基础知识,...

    HTML制作电子发票收据凭证界面,并可填写数字中文数字,自动计算合计等功能.zip

    这个系统允许用户在网页上直接填写发票或收据的详细信息,包括金额,并且能够自动计算总额,大大提高了财务处理的效率和准确性。 首先,HTML表格是实现这一功能的核心。在HTML中,`&lt;table&gt;`元素用于创建表格,而`...

    JS自动格式化输入的数字/千位分隔符.rar

    标签“JS特效-表单按钮”可能意味着这个代码还包含与表单按钮交互的逻辑,比如在用户点击按钮时进行验证或计算。在实际应用中,可能会有额外的逻辑处理,例如检查输入是否有效、处理溢出或负数的情况等。 总之,这...

    可支付表单项目.zip

    例如,当用户输入支付金额时,可以即时计算应付总额或显示折扣信息。此外,可能还包括使用cookies或本地存储来记住用户偏好,提供个性化的服务。 **APP联动**: 在现代Web应用中,常需要与移动APP协同工作,以提供...

    ajax、Ztree、GridView、单行展示4条数据、金额合计

    5. 金额合计:在网页应用中,对金额的计算和汇总是一项常见需求。这通常涉及到数值运算、货币格式化以及可能的货币转换。开发者需要确保计算的准确性和显示的规范性,比如保留适当的位数、正确处理小数点等。此外,...

    Javascript图片文字识别插件JS-OCR.zip

    JavaScript图片文字识别插件JS-OCR是一个用于在前端实现OCR(Optical Character Recognition,光学字符识别)功能的工具。OCR技术允许程序从图像中提取文本,使得计算机能够识别和处理图像中的文字。在这个JS-OCR...

    XML作业二-第四题 编写一个网页文件,使用一个表单让用户填写购货订单

    编写一个网页文件,使用一个表单让用户填写购货订单。...(3)金额在提交时自动计算,并与所填的"金额"比较; (4)如(2)(3)有错误时,则返回已填购货单,并提示错误位置和原因;如果没有 错误,则返回已成功提交的页面。

Global site tag (gtag.js) - Google Analytics