javascript - 根据同一表行中输入框的最高值查找元素

标签 javascript jquery

我有一个包含三列的表格。

  1. 第 1 列有输入框。
  2. 第 2 列包含一个“转化”数字,该数字将其值与输入框(第 1 列)中的值相乘
  3. 结果在第3列输出。

它看起来像这样:

5    2   10
1    1    1
2    1    2
3    2    6

如何根据同一行中输入框的最高值获取第 3 列的值?

到目前为止我的代码:

HTML

<table border="1px">
    <tbody id="mbtbody">
      <tr>
          <td><input class="weightinputclass" type="number" value="0"></td>
          <td class="conversionclass">5</td>
          <td class="totals"></td>
      </tr>
      <tr>
          <td><input class="weightinputclass" type="number" value="0"></td>
          <td class="conversionclass">1</td>
          <td class="totals"></td></tr>
      <tr>
          <td><input class="weightinputclass" type="number" value="0"></td>
          <td class="conversionclass">1</td>
          <td class="totals"></td>
      </tr>
    </tbody>
</table>

jQuery

$("#btn").click(function(){
   var rows = $("#mbtbody").children("tr");
   var total = 0;
     rows.each(function(idx, row) {
       var $row = $(row);
       total += parseInt($row.find('input.weightinputclass').val());
       $("#totalweight").html(total);       
     });
})

$(document).on('input', '.weightinputclass', function () {
   var $row = $(this).closest("tr");
   var weight = $row.find("input.weightinputclass").val();
   var conversion= $row.find(".conversionclass").html();
   $row.find(".totals").text(weight*conversion);
})

fiddle : https://jsfiddle.net/rdawkins/9fyLqfgr/16/

最佳答案

这是我找到的解决方案:

Javascript

$("#btn").click(function(){
   var rows = $("#mbtbody").children("tr");
   var total = 0;
     rows.each(function(idx, row) {
       var $row = $(row);
       total += parseInt($row.find('input.weightinputclass').val());
       $("#totalweight").html(total);       
     });

     var currentMax = 0;
     var currentMaxEl;
     $('.weightinputclass').each(function (idx, element) {
        var elVal = parseInt($(element).val());

        if(elVal > currentMax) {
          currentMax = elVal;
          currentMaxEl = $(element);
        }
     });
     var maxWeight = currentMaxEl.parent().parent().children('.totals').first().html();
     $('#highestinput').html(2000 - maxWeight);
})

$(document).on('input', '.weightinputclass', function () {

var $row = $(this).closest("tr");
var weight = $row.find("input.weightinputclass").val();
var conversion= $row.find(".conversionclass").html();
$row.find(".totals").text(weight*conversion);
});

fiddle

https://jsfiddle.net/9v6j8qub/2/

关于javascript - 根据同一表行中输入框的最高值查找元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36455906/

相关文章:

javascript - 如何保持子div

javascript - IE问题: disable linkbutton onclientclick and continue doing the onclick function

javascript - jQuery $.isNumeric 在控制台上抛出错误

javascript - 如何在 Internet Explorer 8 中使用 new Image()?

javascript - 为什么 Promise 中的回调不延迟运行?

javascript - 停止页面卸载/关闭

javascript - 更改父类

javascript - Selenium WebDriver Python重新加载html而不刷新页面

javascript - 如何在 Firebase 表上进行联接

javascript - jquery 数据表column.data 未定义