Question

我正在尝试使用此代码逐行获取值并对该值进行计算，但我们在最后一行中得到结果，并在表2的每一行中显示最后一行结果。

$(document).ready(function() {

  $("#tbUser").on('click', '.btnDelete', function() {

    var idx = $(this).closest('tr').index();

    $("#tbUser").find("tr").eq(idx).remove();
    $("#tbUsers").find("tr").eq(idx - 1).remove();
  });



  $("#tbUser").on('click', '.btnAdd', function() {

    $("#tbUser").append("<tr class='item'><td>Pad</td><td id='selection'>0.000307</td><td><input type='text' name='BottomHoleRate' id='BottomHoleRate'></td><td><input type='text' name='CleanVolume' id='CleanVolume'></td><td><input type='text' name='BottomHoleConcentration' id='BottomHoleConcentration'></td><td>v 2.2</td><td><input type='text' name='Chemvol' id='Chemvol'></td><td><button class='btnAdd'>Add</button></td><td><button class='btnDelete'>Delete</button></td></tr>");
    $("#tbUsers").append("<tr><td><input type='text' name='StageTime' id='StageTime' value=''></td><td><input type='text' name='SlurryRate' id='SlurryRate'></td><td><input type='text' name='CleanRate' id='CleanRate'></td><td><input type='text' name='BlenderConcentration' id='BlenderConcentration'></td><td><input type='text' name='ProppantVolumeRate' id='ProppantVolumeRate'></td><td><input type='text' name='ProppantMassRate' id='ProppantMassRate'></td><td><input type='text' name='ProppantAVG' id='ProppantAVG'></td><td><input type='text' name='ProppantStageMass' id='ProppantStageMass'></td><td><input type='text' name='ProppantCumulativeMass' id='ProppantCumulativeMass'></td><td><input type='text' name='ProppantVolume' id='ProppantVolume'></td><td><input type='text' name='ProppantCumulativeVolume' id='ProppantCumulativeVolume'></td><td><input type='text' name='SlurryStageVolume' id='SlurryStageVolume'></td><td><input type='text' name='SlurryCumulativeVolume' id='SlurryCumulativeVolume'></td></tr>");

    $("#tbUsers2").append("<tr><td>Pad</td></tr>");
    $("#tbUsers3").append("<tr><td>Pad</td></tr>");

  });
});


$('button').on('click', function() {

  $("#tbUser tr.item").each(function() {
    var BottomHoleRate = $(this).find("input[name='BottomHoleRate']").val(),
      CleanVolume = $(this).find("input[name = 'CleanVolume']").val();
    bhc = $(this).find("input[name = 'BottomHoleConcentration']").val();
    Chemvol = $(this).find("input[name = 'Chemvol']").val();
    // SlurryStageVolume=document.getElementById('SlurryStageVolume').value;

    SlurryRate = BottomHoleRate;
    blenderconcentration = bhc;
    ProppantAVG = document.getElementById('selection').innerText;

    proppant_stage_mass = CleanVolume * bhc;
    pro_cum_mass = proppant_stage_mass;
    proppant_vol = proppant_stage_mass * ProppantAVG;
    pro_cum_vol = proppant_vol;
    slurry_stage_vol = CleanVolume * (1 + ProppantAVG * bhc);

    slurry_cum_vol = slurry_stage_vol;

    cleanrate = SlurryRate / (1 + ProppantAVG + bhc);
    stage = slurry_stage_vol / SlurryRate;

    proppant_vol_rate = cleanrate * bhc * ProppantAVG;
    proppant_mass_rate = cleanrate * bhc;
    chem_rate1 = Chemvol * cleanrate;
    chem_vol = Chemvol * CleanVolume;
    $('input[name="StageTime"]').val(stage);
    $('input[name="SlurryRate"]').val(SlurryRate);
    $('input[name="CleanRate"]').val(cleanrate);
    $('input[name="BlenderConcentration"]').val(blenderconcentration);
    $('input[name="ProppantVolumeRate"]').val(proppant_vol_rate);
    $('input[name="ProppantMassRate"]').val(proppant_mass_rate);
    $('input[name="ProppantAVG"]').val(ProppantAVG);
    $('input[name="ProppantStageMass"]').val(proppant_stage_mass);
    $('input[name="ProppantCumulativeMass"]').val(pro_cum_vol);
    $('input[name="ProppantVolume"]').val(proppant_vol);
    $('input[name="ProppantCumulativeVolume"]').val(pro_cum_vol);
    $('input[name="SlurryStageVolume"]').val(slurry_stage_vol);
    $('input[name="SlurryCumulativeVolume"]').last().val(slurry_cum_vol);

   
  });
});

<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>

<body>
  <table id="tbUser" class="tblUser" name="tblUser">
    <tr>
      <td><button class="btnDelete">Delete</button></td>
      <td><button class="btnAdd">Add</button></td>
    </tr>
    <tr>
      <th>Stage Name</th>
      <th>Proppant Selection</th>
      <th>Bottom Hole Rate</th>
      <th>Clean Volume</th>
      <th>Bottom Hole Concentration</th>
      <th>Quality</th>
      <th>Chem 1 Vol/Vol</th>
    </tr>
  </table>

  <h2>table 2</h2>
  <table id="tbUsers">
    <tr>
      <th>Stage Time (min)</th>
      <th>Slurry Rate</th>
      <th>Clean Rate</th>
      <th>Blender Concentration</th>
      <th>Proppant Volume Rate</th>
      <th>Proppant Mass Rate</th>
      <th>Proppant AVG</th>
      <th>Proppant Stage Mass</th>
      <th>Proppant Cumulative Mass</th>
      <th>Proppant Volume</th>
      <th>Proppant Cumulative Volume</th>
      <th>Slurry Stage Volume</th>
      <th>Slurry Cumulative Volume</th>
    </tr>
  </table>

  <h2>table 3</h2>
  <table id="tbUsers2">
    <tr>
      <th>Chem rate 1</th>
    </tr>
  </table>

  <h2>table 4</h2>
  <table id="tbUsers3">
    <tr>
      <th>Chem Volume 1</th>
    </tr>
  </table>

  <input type="button" name="submit" value="submit" />
  <button>submit</button>

我想在另一个表中逐行显示这些值，这意味着第一行值显示在另一个表的第一行中，第二行值显示在另一个表的第二行中，依此类推。

我如何逐行获取一个表的值，然后使用jQuery在另一个表中显示这些值

0 个答案: