jQuery多个input求和的实现方法

 这篇文章主要介绍了jQuery多个input求和的实现方法,涉及jQuery获取input表单元素值及运算的相关技巧,需要的朋友可以参考下

 
 

本文实例讲述了jQuery多个input求和的实现方法。分享给大家供大家参考。具体实现方法如下：

html页面代码如下：

?

1
2
3
4
5
6
7
8
9

<td>
<input name="add" id="add" readonly="readonly"/>
</td>
<pre name="code" class="html"><td>
<input name="add1" id="add1"/>
</td>
<td>
<input name="add2" id="add2"/>
</td>

jQuery部分代码如下：

?

1
2
3
4
5
6
7
8
9
10
11
12
13
14

<script>
$("input[id^='add']").change(function(){
var sum=0;
$("input[id^='add']").each(function(){
var r = /^-?d+$/ ;　//正整数
if($(this).val() !=''&&!r.test($(this).val())){
$(this).val(""); //正则表达式不匹配置空
}else if($(this).val() !=''){
sum+=parseInt($(this).val());
}
document.getElementById("add").value=sum;
});
});
</script>

由于input属性为readonly，所以在浏览器中按Backspace删除该input的值时会出现页面返回的情况，解决方法可参照前面一篇《JQuery实现防止退格键返回的方法》

希望本文所述对大家的jQuery程序设计有所帮助。

时间： 2024-09-22 08:08:08

jQuery多个input求和的实现方法的相关文章

jQuery多个input求和的实现方法_jquery

本文实例讲述了jQuery多个input求和的实现方法.分享给大家供大家参考.具体实现方法如下: html页面代码如下: <td> <input name="add" id="add" readonly="readonly"/> </td> <pre name="code" class="html"><td> <input name=&quo

jQuery文本框(input textare)事件绑定方法教程_jquery

目前1.7以上,jquery​的事件绑定已经用on替换了原来的bind,接下来为大家介绍下bind的使用方法及input textare事件,感兴趣的朋友可以参考下 (1)jquery 绑定事件 目前1.7以上,jquery的事件绑定已经用on替换了原来的bind: 区别:(个人理解)bind是一次绑定事件到每一个子节点:on是只绑定到父节点,然后冒泡到各个子节点: 用法:bind 一个事件,一个方法:$(".class input").bind('click',function(e)

jQuery简单实现input文本框内灰色提示文本效果的方法_jquery

本文实例讲述了jQuery简单实现input文本框内灰色提示文本效果的方法.分享给大家供大家参考,具体如下: $(function(){ $(".grayTips").each(function(){ //遍历每个文本框 var objTextBox=$(this); var oldText=$.trim(objTextBox.val()); objTextBox.css("color","#888"); objTextBox.focus(fun

jquery对所有input type=text的控件赋值实现方法_jquery

如下所示: function resetData() { $("input[type=text]").each( function() { $(this).attr("value",""); } ); } 以上这篇jquery对所有input type=text的控件赋值实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持. 以上是小编为您精心准备的的内容,在的博客.问答.公众号.人物.课程等栏目也有的相关内容,欢迎继

jquery动态更换网页背景图的方法

 这篇文章主要介绍了jquery动态更换网页背景图的方法,需要的朋友可以参考下 有些时候,我们可以为用户提供很贴心的功能,比如判断用户是什么时候来访问的,然后给出一句问候,晚上好,下午好之类的.并且更换网页的背景颜色,比如晚上的时候就可以用满天星星的背景,白天就用阳光灿烂,或者特定节日就用该主题背景,让你的网站显得非常灵活,不枯燥.   下面就如何实现背景更换给出一种解决方法:   如何实现   很简单,下面是 JQuery 代码:    代码如下: function doChangeBkg()

jQuery实现搜索关键字自动匹配提示方法

在现在的Web设计中,提高用户体验是企业最为注重的内容之一.在搜索表单中,根据输入的部分内容进行关键字匹配提示功能,就是最直观和常用的交互体验,类似功能已经被多数的互联网网站应用.例如Google的搜索框效果如下: 这里介绍一个jQuery实现搜索关键字自动匹配提示方法.jQuery AutoComplete 是一个基于jQuery实现搜索关键字自动匹配提示的插件,该插件可扩展性强,表现性能优越,方便整合到自己的项目中使用:兼容IE 6.0+, FF 2+, Safari 2.0+, Opera

jQuery来获取RadioButtonList成员内容的方法

 这篇文章主要介绍了通过jQuery来获取RadioButtonList成员内容的方法,大家参考使用吧  代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Web.Default" %>   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM

jQuery实现转动随机数抽奖效果的方法

  本文实例讲述了jQuery实现转动随机数抽奖效果的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69

JQuery实现动态添加删除评论的方法

  本文实例讲述了JQuery实现动态添加删除评论的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69