从 PHP foreach 循环中获取 Ajax 变量（第二部分）答案

【问题标题】：Get Ajax variable from the PHP foreach loops (part II)从 PHP foreach 循环中获取 Ajax 变量（第二部分）
【发布时间】：2013-08-12 12:56:31
【问题描述】：

由于 dianuj 的大力帮助，我昨天解决了我的 Ajax 循环问题。点击here！

该解决方案帮助我每次更改输入区域中的数字时发送和获取数量变量 (class="qty")。

现在我想稍微修改一下我的 Ajax 和 PHP 循环以获得“总”变量（数量 * 价格）。我尝试通过放置带有价格值的“隐藏”输入区域来获取“价格”变量。（请参阅以下脚本）。脚本获取数量变量（class="qty"）和价格（class="价格”）没有问题。

但是，当我输入不同的数量时，脚本只会选择第一个价格并乘以我更改的数量。

例如，我在函数中有三个项目，三个不同的价格： 1. 苹果 $1 x1 2. 橙子 $10 x3 3. 香蕉 $2 x4

脚本结果将显示 $1 * (2+3+4) 而不是正确的 $1*2+$10*3+$2*4 （ajax脚本仍然可以毫无问题地获取价格和数量的变量）。

我的 Ajax 和 PHP 循环如下，似乎他们可以毫无问题地获取和发送 qty 和 price 变量（但只有第一个项目的固定价格）：

<script language="JavaScript">
$(document).ready(function() {
       $("form").mouseleave( function() {

 //get qty value and price value from the loop

var totalVal =0;
$( ".qty" ).each(function() {
  totalVal += ($(this).val()*$(".price").val()); 
});      

      // get 
        $.ajax({
        type: 'GET',
        url:  'getSunBody.php',
        data: { 
              //sent the total variable to php script (xml)
              total : totalVal,
                 }, 
        success: function(data) {
           // get XML value
           $('#result').html($(data).find('total').text()); 
           $('#result1').html($(data).find('caution').text());   

        } 
      });    
      return false;
   });

   });
</script> 
</head>

<body>
<div id="display">
<form action="sessionCartUpdate.php">
<table width="780" border="0" align="center" cellpadding="4" cellspacing="0">
<?php
foreach( $_SESSION["psn"] as $i => $data ){
?>

<input type="hidden" name="psn" value="<?php echo $_SESSION["psn"][$i];?>">
<tr>
  <td bgcolor="#CCCCCC" font color="black"><?php echo $_SESSION["psn"][$i];?></td>
  <td bgcolor="#CCCCCC"><?php echo $_SESSION["pname"][$i];?></td>
  <td bgcolor="#CCCCCC"><?php echo $_SESSION["price"][$i];?></td>
  <td bgcolor="#CCCCCC"><input type="text" class="qty" name="qty[]" value="<?php echo $_SESSION["qty"][$i];?>"></td>

    <input type="hidden" class="price" value="<?php echo $_SESSION["price"][$i];?>" >

  <td bgcolor="#CCCCCC"><input type="submit" name="btnUpdate" value="update" />
      <input type="submit" name="btnDelete" value="delete" />
      </td>
</tr><br />

<?php
}
?>
<tr><td colspan="5" align="center">the total:<div id="result" class="box" style="height=350px;"></div><div id="result1" class="box" style="height=350px;"></div>
<div id="result2" class="box" style="height=350px;"></div></td></tr>
</table>
</form>

我还包括我的 php 脚本，作为上面 ajax 脚本的 xml：

<?php
// XML
header("Content-Type: text/xml");
header("Content-Type:text/html; charset=utf-8");

//get total value ("qty * price") from the ajax

$total = (isset($_POST["total"]) ) ? $_POST["total"] : $_GET["total"];

echo "<?xml version=\"1.0\" ?>";

echo "<caculation>"; 

echo "<total>" . $total . "</total>";


if ($total==0)
    echo "<caution>"."please put number!"."</caution>";
    else if ($total<=500)
    echo "<caution>"."You should buy more!"."</caution>";
    echo "";

echo "</caculation>";

?>

非常感谢您能提供宝贵的建议来帮助我修复上述错误！

【问题讨论】：

标签： php javascript jquery ajax

【解决方案1】：

.each 循环是针对数量而不是价格，所以它选择第一个价格，因为循环是针对数量而不是价格，你应该这样做

<script language="JavaScript">
$(document).ready(function() {
       $("form").mouseleave( function() {

 //get qty value and price value from the loop

var totalVal =0;
$( ".qty" ).each(function(i) {
  totalVal += ($(this).val()*$(".price:eq("+i+")").val()); 
});      

      // get 
        $.ajax({
        type: 'GET',
        url:  'getSunBody.php',
        data: { 
              //sent the total variable to php script (xml)
              total : totalVal,
                 }, 
        success: function(data) {
           // get XML value
           $('#result').html($(data).find('total').text()); 
           $('#result1').html($(data).find('caution').text());   

        } 
      });    
      return false;
   });

   });
</script>

使用.each 循环的索引并获取放置在该索引处的价格我使用了jquery 选择器:eq(index here)，我相信每个数量都会有价格价值

【讨论】：

非常感谢您提供的及时而强大的解决方案，它总能在一夜之间消除我的头痛！衷心感谢迪亚努伊先生！
@PeterRen 请阅读此内容:) meta.stackexchange.com/questions/17878/… 欢迎您

【解决方案2】：

我还没有确认下面的代码，但它至少应该能让你走上正轨

var totalVal =0;
$('.qty').each(function() {
    var price = $(this).closest('tr').find('.price').val();
    totalVal += ($(this).val()*price);
});

【讨论】：

也非常感谢安德斯先生的好意建议！