时间戳

首页 > 解决方案 > JQuery将特定表行中的所有数据与约束相加

javascript - JQuery将特定表行中的所有数据与约束相加

问题描述

<table>
   <tr>
      <td><input value = "100/100"/></td>
      <td><input value = "100/100"/></td>
      <td><input value = "100/100"/></td>
      <td class="total">300/300</td>
   </tr>
   <tr>
      <td><input value = "200/200"/></td>
      <td><input value = "200/200"/></td>
      <td><input value = "200/200"/></td>
      <td class="total">600/600</td>
   </tr>
</table>

$(document).ready(function(){  
    $("input").keyup(function(){
        var suma = 0; 
        $(this).parents("tr").children("td").children().each(function(){
            suma+= parseInt($(this).val());
        });
        $(this).parent().parent().children(":last").text(suma);
    });
});

上面的 jquery 函数在我输入数值时得到了总和，但我想使用分隔符“/”示例 10/20 更改我的输入值格式。我想要这个例子的总和 10/20 + 20/30 = 30/50。我知道我的输入值将采用字符串的形式，并且必须解析分子和分母值，将它们相加并以字符串格式将其作为总数放回。请帮忙。

标签： javascriptjqueryhtml

解决方案

@Priya Srivatsa，尝试以下解决方案

$(document).ready(function(){  
    $("input").keyup(function(){
        var suma = 0; 
        var firstSum = 0;
        var secondsum = 0;
        $(this).parents("tr").children("td").children().each(function(){
            // suma+= parseInt($(this).val());
           
            var getVal = $(this).val();
            if(getVal.indexOf("/")>-1)
            {
               var sumVals = getVal.split('/');
               firstSum+= parseInt(sumVals[0]);
               secondsum+= parseInt(sumVals[1]);
            }
            else{
               firstSum+= parseInt(getVal);
            }
            
        });
        $(this).parent().parent().children(":last").text(firstSum + "/" +secondsum );
    });
     });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
   <tr>
      <td><input value = "100/100"/></td>
      <td><input value = "100/100"/></td>
      <td><input value = "100/100"/></td>
      <td class="total">300/300</td>
   </tr>
   <tr>
      <td><input value = "200/200"/></td>
      <td><input value = "200/200"/></td>
      <td><input value = "200/200"/></td>
      <td class="total">600/600</td>
   </tr>
</table>

让我知道这个解决方案是否适合您？

推荐阅读