如何使用java脚本onfocusout在PHP while循环中动态求和多个输入记录

Question

我正在使用一种方法来计算此idid="salenag<?php echo $a; ?>"的值多个值，这些值来自使用PHP的数据库，然后我将把值添加到输入字段中——id nosale_nag中显示的所有多个输入字段的总和。我使用了一个Javascript方法，但它不起作用；它是如何正确工作的——它用于销售点缺货。我想要一个解决方案。请帮帮我。

<input type='text' value='0' id='sale_nag'>
<table>
<?php
$a =1;
while ($pro_row = mysqli_fetch_assoc($select_pro)) {
$rm =  $pro_row['room'];
$ra =  $pro_row['rack'];
$sal =  $pro_row['sale_nag'];
$ma = $pro_row['marka'];
$cha = $pro_row['chalan'];

$pro_query2="SELECT *,SUM(sale_nag) AS snag FROM stockout_details  WHERE  marka='$ma' and chalan='$cha' and room='$rm' and rack='$ra'
";
$select_pro2 = mysqli_query($con, $pro_query2);
$pro_row2 = mysqli_fetch_assoc($select_pro2);
if ( $sal - $pro_row2['snag'] > 0) {
?>
<div class="form_grid_2 d-none"  >
<input name="inv[]" required class=""  value="<?php echo $inv_pro1 ; ?>"   type="text"/>
<span class="label_intro ">inv #</span>
</div>
<div class="form_grid_2 d-none"  >
<input name="purchi[]" required class=""  value="<?php echo $id ; ?> "   type="text"/>
<span class="label_intro ">Purchi #</span>
</div>
<div class="form_grid_2 d-none"  >
<input name="invstockin[]" required class="" readonly value="<?php echo $pro_row['stockoutinv'];?>"   type="text"/>
<span class="label_intro ">Inv#</span>
</div>
<div class="form_grid_2"  >
<input name="marka[]" required class=""  readonly value="<?php echo $ma = $pro_row['marka'];?>"   type="text"/>
<span class="label_intro ">Marka #</span>
</div>
<div class="form_grid_2 "  >
<input name="chalan[]" required class=" " readonly value="<?php echo $cha = $pro_row['chalan'];?>"   type="text"/>
<span class="label_intro ">Chalan #</span>
</div>
<div class="form_grid_2 "  >
<?php
?>
<input name="nag[]"  class="" readonly value="<?php
echo   $sal - $pro_row2['snag'] ;
?>"    type="text"/>
<span class="label_intro ">NAG #</span>
</div>
<div class="form_grid_2 " >
<input name="outnag[]"  id="salenag<?php echo $a; ?>" onfocusout="chachvalue(<?php echo $a; ?>);" class=""  value="0"    type="text"/>
<span class="label_intro ">Nag stock-out #</span>
</div>
<div class="form_grid_2 "  >
<input name="room[]" required class="" readonly value="<?php echo $pro_row['room'];?>"   type="text"/>
<span class="label_intro ">Room #</span>
</div>
<div class="form_grid_2 "  >
<input name="rack[]" required class="" readonly  value="<?php echo $pro_row['rack'];?>"   type="text"/>
<span class="label_intro ">Rack #</span>
</div>
<script type="text/javascript">
function  chachvalue(<?php echo $a;?>){
var x1 = document.getElementById('salenag<?php echo $a ;?>').value;
var x2 = document.getElementById('sale_nag').value;
var result  = x1 + x2 ;
document.getElementById('sale_nag').value=result;
}
</script>

<?php
$a++; }  

}
?>
</table>

Answer 1

由于您的问题被标记为jQuery，我假设您可以使用它。

首先，将您的功能更改为：

function chachvalue(element) { 

// get value of input that unfocused
var x1 = parseInt(element.val()); 

// select #sale_nag element
var sale_nag = $('#sale_nag');
// set value of sale_nag to sale_nag + x1
sale_nag.val(parseInt(sale_nag.val()) + x1);
}

现在，为您的输入创建一个jQuery处理程序

$('.outnag_input').on('focusout', function() {
chachvalue($(this));
});

现在您的输入元素可以简化为这个

<input name="outnag[]" class="outnag_input" value="0" type="text"/>

您还应该将chachvalue()函数和focusout处理程序移动到PHP循环的外部的。