jquery table 数字问题
  $.each(typeData, function (i, n) {
                                            //这里是增加1 和减1 HTML
                                            var jisuan = "<div class=\"amount_box\"><a href=\"javascript:;\"   class=\"reduce reSty\">-</a><input type=\"text\" value=\"1\" class=\"sum\"><a href=\"javascript:;\"   class=\"plus\">+</a></div>";
                                            //tr表格
                                            tbBody += "<tr><td id=" + n.ID + ">" + n.ID + "</td>" + "<td>" + n.mingcheng + "</td> " + "<td>" + jisuan + "</td>" + "<td class='sum_price'>" + n.jiage + "</td>" + "<td class='price'>ss</td><td onClick='d(this)'><i class='fa fa-trash-o'></i></td></tr>"

                                            //遍历#myTb下所有的进行比对重复则为追加
                                            if (!$("#myTb tr").children('td[id=' + n.ID + ']').length) {                                              

                                                $("#myTb").append(tbBody);                                                



                                            }
                                            else {
                                                layer.msg('已存在-' + n.mingcheng + '!', { icon: 5, time: 3000 });
                                                return;
                                            }
                                            //操作Plus类 input 进行加1运算,问题出在这里, 如果追加3行tr 点一下.plus类则会出现+3次的现象,不知道问题出在哪里
                                            //放在这里点一次加+2,放到if里可以执行,如果表有3行,执行后第一行点.plus会出现加3次input显示3,第二行加2次,第3行加一次
                                            //怎么操作让他们3行数据互不影响?点击plus  input里的数加1 而不是根据行的多少来添加

                                            $('.plus').click(function () {

                                                var $inputVal = $(this).prev('input'),
                                                   $count = parseInt($inputVal.val()) + 1;
                                                $inputVal.val($count);

                                            });
                                        })

//操作Plus类 input 进行加1运算,问题出在这里, 如果追加3行tr 点一下.plus类则会出现+3次的现象,不知道问题出在哪里
//放在这里点一次加+2,放到if里可以执行,如果表有3行,执行后第一行点.plus会出现加3次input显示3,第二行加2次,第3行加一次
//怎么操作让他们3行数据互不影响?点击plus input里的数+1 而不是根据行的多少来添加

0

2个回答

为什么要做的这么复杂?
单独做一个函数,传入需要更改的对象和值,点一下就不会影响其他的,写个demo,给你看看

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <table>
        <tr>
            <td><input type="text" value="0"><input type="button" onclick="addNum(this,1)" value="点我加1"></td>
        </tr>
        <tr>
            <td><input type="text" value="0"><input type="button" onclick="addNum(this,2)" value="点我加2"></td>
        </tr>
        <tr>
            <td><input type="text" value="0"><input type="button" onclick="addNum(this,3)" value="点我加3"></td>
        </tr>
    </table>
</body>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script>
    function addNum(obj,num){
        var obj = $(obj).siblings("input[type='text']");
        var old = parseInt(obj.val());
        obj.val("").val(old+num)
    }
</script>
</html>

0
qq_32409957
可爱的小书包 你加下qq吧,把你问题说一下,1290567551
7 个月之前 回复
shayixiong
shayixiong 我上面的图,就是遍历出来的,每新添加一行,都会出现个 加数字的那个input
7 个月之前 回复
shayixiong
shayixiong 你这个可以试一下异步遍历操作
7 个月之前 回复
shayixiong
shayixiong 你这个可以, 但是用到项目中不行啊
7 个月之前 回复
qq_32409957
可爱的小书包 回复shayixiong: 你试试我的看看
7 个月之前 回复
shayixiong
shayixiong 回复: 我可能没表达清楚, 点击一次都+1,各不影响,因为现在的问题是 点击最上面的,就直接+3了,不是+1
7 个月之前 回复
shayixiong
shayixiong 是异步加载的, 每加载一次就要生成一个 ,所以会影响,应该怎么处理?
7 个月之前 回复

图片说明

0
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
jquery table 数字问题
```rn $.each(typeData, function (i, n) rn //这里是增加1 和减1 HTMLrn var jisuan = " -+";rn //tr表格rn tbBody += "" + n.ID + "" + "" + n.mingcheng + " " + "" + jisuan + "" + "" + n.jiage + "" + "ss"rn rn //遍历#myTb下所有的进行比对重复则为追加rn if (!$("#myTb tr").children('td[id=' + n.ID + ']').length) rn rn $("#myTb").append(tbBody); rn rn rn rn rn else rn layer.msg('已存在-' + n.mingcheng + '!', icon: 5, time: 3000 );rn return;rn rn //操作Plus类 input 进行加1运算,问题出在这里, 如果追加3行tr 点一下.plus类则会出现+3次的现象,不知道问题出在哪里rn //放在这里点一次加+2,放到if里可以执行,如果表有3行,执行后第一行点.plus会出现加3次input显示3,第二行加2次,第3行加一次rn //怎么操作让他们3行数据互不影响?点击plus input里的数加1 而不是根据行的多少来添加rn rn $('.plus').click(function () rnrn var $inputVal = $(this).prev('input'),rn $count = parseInt($inputVal.val()) + 1;rn $inputVal.val($count);rnrn );rn )rn```rnrn //操作Plus类 input 进行加1运算,问题出在这里, 如果追加3行tr 点一下.plus类则会出现+3次的现象,不知道问题出在哪里rn //放在这里点一次加+2,放到if里可以执行,如果表有3行,执行后第一行点.plus会出现加3次input显示3,第二行加2次,第3行加一次rn //怎么操作让他们3行数据互不影响?点击plus input里的数+1 而不是根据行的多少来添加
使用jQuery实现table表格排序js插件
在前不久做的一个web项目中,需要实现js表格排序的效果,当时为了省事,就在网上找了几个相关的js插件,像:jQuery的table排序插件(感觉其使用比较麻烦或不清楚其具体用法,就没有使用)、原生态js的table排序插件等,最后比较看了下——采用了一个原生态js的table排序插件,并在其基础上做了些修改,虽有些勉强或有些地方使用不太舒服,但最算是比较好的实现了当时需要的功能。而前两天,对原有
Jquery datatable中文排序问题
先扩展datatable的的排序功能,添加一个自定义排序函数 //为jq datatable 自定义中文排序 jQuery.fn.dataTableExt.oSort['chinese-sort-asc'] = function(s1,s2) { return s1.localeCompare(s2); }; jQuery.fn.dataTa
使用jquery来给tr进行重新排列
//向上移动 function moveFileUp(obj){ //alert(trId); var objParentTR = $(obj).parent().parent(); var prevTR = objParentTR.prev(); if (prevTR.length > 0) { var name=prevTR.attr('name'); if(name=='
jquery和js获取table中数据
rindex行数,cindex列数 jquery: var content = $(&quot;#tab tr:eq(&quot;+rindex+&quot;) td:eq(&quot;+cindex+&quot;)&quot;).text(); js: var content= document.getElementById(&quot;tab&quot;).rows[rindex].cells[cindex].innerHTML;
bootstrap jquery table 使用中遇到的问题
做一个大数据的项目,web页面数据展示用的ACE,所以有些页面想用到Jquery table来做, 整个项目用Python+Django+ACE来做web前后端 模板本身的演示效果如下,个人感觉还是相当美观,而且排序和导出功能也非常清晰: 开始写通常主要技术点有以下几点 - 后端整理数据 - 前端Ajax请求数据 - 构造table前两项都没有问题,到了最终页面套用插件展示的时候,遇到了
jquery动态生成table时 label失效 丢掉部分样式
先上图:图1:jquery回调函数数据动态生成table,checkbox样式不全图2:为图1对应的部分代码(火狐浏览器下查看)图3:alert()弹出的,动态生成的table内容图4:将弹出的内容手动复制到table里面,不再使用js动态生成,样式正常暂未解决,使用了jqueryui buttons和layer页面层。因为是百度翻译,一共就28种语言,况且每语言对应的代码(如 zh en ru)...
JQuery实例(三)- 动态修改Table中的内容
在第一个例子中,二级联动,改变省份的时候,会动态修改另一个下拉框的内容。 这里修改为,改变一个Table中的内容。 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> JQuery Demo 3.动态修
Jquery、js计算table行合计
计算table的行合计比计算列合计
jQuery.tablesorter插件实现排序
简介 Tablesorter 是一个用来直接在浏览器上对表格数据进行排序的jQuery插件,无需再次刷新页面,支持多种单元格数据类型,例如数值、字符串、日期和自定义排序。 使用     &amp;lt;link href=&quot;&amp;lt;%=basePath %&amp;gt;static/jQuery/style.css&quot; rel=&quot;stylesheet&quot; /&amp;gt;     &amp;lt;script type=&quot;...
Jquery、js计算table列合计
利用Jquery选择器,计算table中的某一列,某一行的合计,非常方便。xia
jq遍历table切换
利用jq遍历制作的简单的table切换效果,利用此资源可以在比较大的需要table切换效果时减少jq代码,以此来优化界面。
jquery table 导出 excel
jquery table 导出 excel ;jquery table 导出 excel ;jquery table 导出 excel ;
table 绑定数据 jquery 分页
table 绑定数据 jquery 分页 table 绑定数据 jquery 分页 table 绑定数据 jquery 分页
jquery对table做排序操作
最近要对报表数组进行排序,在前端处理如下: 首先在前台页面加载时对每行tr添加自定义的属性data-sort-field-ftime,属性值为要排序的字段的值(我的是数字比较方便): $.each(jsonarray, function(i, obj) { troptions += ""; troptions += ""+(Number(obj.cdsPrem)/
jquery实现动态表格的数值相加
function getJobSum(){ var tb=document.getElementById("t1"); var JobSum=$("input[name=JobSum]"); var JobScore=0; JobScore=Number(JobScore); for(var i=1;itb.rows.length;i++){ var b=$("input[n
table2excel导出Excel,科学计数法显示的问题
只需在td上加上如下style,  style="mso-number-format:'\@';" ng-bind="data.paySerialNo"> 其他自定义单元格格式 样式     mso-number-format:"0" NO Decimals mso-number-format:"0\.000" 3 Decimals
Jquery对Table表格排序(方法一)
&amp;lt;html&amp;gt; &amp;lt;title&amp;gt;table简单实例&amp;lt;/title&amp;gt; &amp;lt;script type=&quot;text/javascript&quot; src=&quot;jquery-1.7.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt; &amp;lt;style type=&quot;text/css&quot;&amp;gt;      div         {  
jquery实现动态操作table
使用jquery实现动态创建行、删除行、行内计算、提交表格数据。 <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> /js/jquery-1.11
jquery tablesorter 动态添加数据时,排序有误。
,我从后台动态加载表格,然后运用tablesorter,然后动态更改表格中的数据,排序不会按照更改后的数据进行排序,会按照之前的数据进行排序,?   解决方法。在动态修改数据后,使用$("#scroll").trigger("update");就行了。 官网实例: $(document).ready(function() { $("table").tabl
采用table+jQuery加载数据,实现数据与表格布局的分离
在日常开发工作中,总是遇到通过异步请求数据并用表格展示的的场景,看到很多同事解决此类问题通常采用拼字符串的形式,如: //js代码段...........var td1="B000123"; var td2="张三" var td3="2017-09-17"; var td4="编辑";var tdn=......//此处省略好多列var trString=""+td1+td2+td3+td4+
tableExport.js导出execl-数字格式化方案
一,问题描述 页面显示数据为80.00 小数点精确2位,导出的execl自动将后面的00隐藏掉 需要设置导出execl数据项的格式 页面: 导出execl效果 二:解决方案 1.tableExport.js导出execl里面的原理其实是html导出execl原理,详情可以参考http://www.cnblogs.com/myaspnet/archive/2011/05/06/20...
使用JQuery使表格表头居中,表内容数字居右,文字居左
    $(&quot;tr&amp;gt;td&quot;).css(&quot;text-align&quot;,&quot;left&quot;); $(function(){ $(&quot;#mytable &amp;gt; tbody&quot;).find(&quot;tr&quot;).each(function(){     $(this).find(&quot;td:first-child&quot;).css(&quot;text-align&quot;,&q
Table中采用JQuery slideToggle效果的问题
例子如下: 需求:用JQuery实现,点击最上边的粗加号时,对所有含有子表的Tr进行展开,点击 + 号时,只对当前Tr的子Table内容的动态隐藏和显示; 问题:JQuery的slideToggle() slideUp() slideDown()是不支持在表格的tr上使用滑动效果的,所以不能通过 $(TrDom).slideToggle()来实现滑动 解决方法:把子Table
iview 用jquery合并 table,数据双向绑定
columns4: [ { type: “selection”, width: 44, align: “center”, key: “selection” }, { title: “Language”, key: “language”, align: “center”, width: 110 }, { title: “Platform”, key: “platform”, align: “cen...
使用jquery进行多行表格数据验证
现有如下表单,是一个表格形式的。需要对名称、手机、邮箱这3列做校验,要求:如果该行的名称输错,则提示第几行的名称字段输入错误;后续的字段如果错误,不再进行校验页面html(tableValidate.html)&amp;lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/...
jQuery实现table单元格行合并
目标: 从这样一张表中,合并相同元素为一列 最终期待效果为: 可以看到同一列中相同的元素被合并,这是怎么做到的呢,第一个想法是从每列的第一行数据开始遍历该列,当发现后一行数据跟前一行数据相同时删除该行同时给前一行的rowspan+1,但实际效果问题百出,为什么呢,是这样的,虽然后一行与前一行合并了,但是被合并行依然只占据它原本的位置,而被他合并的单元格的位置,则由各自同行的其他单元格取代它的位
table正反排序 JQuery
table正反排序 JQuery table正反排序 JQuery
jquery 表格 jquery table
jquery 表格 jquery table
动态添加表格行并验证每列不为空
今天开发中遇到一个情况, 要动态创建
tablesorter插件,排序结果不正确的原因
tablesorter是对td中的所有内容进行排序,如果td中含有除了你需要排序的字符之外的字符,很有可能影响排序结果。 解决方法: $(this).tablesorter({ textExtraction: function(node) {                  return node.innerHTML.toLowerCase().replace(/(需要替换的
利用jquery实现在html的表格中使用上下左右键切换单元格,同时只限制单元格输入数字
因其他无关代码比较多,只贴关键代码,请谅解。 解释:tblGrid是表格的id ,onchange是每个单元格都拥有的方法,当然可以根据实际情况更改flag是标志位,保证按照我想要的顺序新增tabindex $(function() { var baseIndex = 100; var flag=1; $("#tblGrid").find("tr").
用sorttable.js对表格进行排序
用sorttable.js对表格进行排序,本博客总结了对表格排序的实现步骤,及排序的高级应用
jquery 序列化表格内容为字符串(serialize)
ajax - serialize() 方法-遍历form进行AJAX提交,序列表表格内容为字符串。 html: Single Single2 value='1'>Multiple Multiple2 Multiple3 check1 check2 <input type="radio" name="radio" value="radio
table td 英文数字换行问题
table td 英文数字换行问题
删除table的第二行后的所有行
$('tr:gt(1)').remove();
jquery parent()方法在table标签中使用需要注意的一个问题
今日,在页面的table中使用parent()方法回溯上级元素的时候发现了一个问题。很有意思,分享下。直接上代码:
jQuery的treeTable不能自动排序么,后台处理解决方案
 先描述下treeTable搭建: HTML代码: &amp;lt;table id=&quot;sys_menu_tab&quot; class=&quot;table table-striped table-bordered table-condensed&quot;&amp;gt; &amp;lt;tr/&amp;gt; &amp;lt;/table&amp;gt; ...
table单元格内容自动换行
1、设置table中的单元格内容自动换行,使用word-wrap在IE浏览器中支持,在firefox浏览器的3.5版本以上开始支持,所以为了满足浏览器兼容性,需要在table中设置table-layout:fixed。 2、word-wrap在div属性中能起到换行的作用,也可以在td中使用div,在div里面设置。         table{border:1px red solid;h
jquery操作html,table。点击按钮,逐行滚动显示,自动选中下一行数据
jquery操作html,table。点击按钮,逐行滚动显示,自动选中下一行数据**以下为示例: 以下为代码: 首先html引用jquery.js**<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <style type="text/cs
文章热词 jQuery学习 机器学习教程 Objective-C培训 交互设计视频教程 颜色模型
相关热词 mysql关联查询两次本表 native底部 react extjs glyph 图标 区块链问题 ios视频开发问题