时间戳

首页 > 解决方案 > 在正确的 span 中呈现由 ajax 请求获取的数据

jquery - 在正确的 span 中呈现由 ajax 请求获取的数据

问题描述

我正在从数据库中获取类 $row['code] 将向每个跨度插入一个唯一的类

<?php 
$query =  "SELECT * FROM `products`";
$result = $con->query($query);
if ($result->num_rows > 0) {
 while($row = $result->fetch_assoc()) { ?>
  <div class="col-sm-3 service">
    <div class="name"><?php echo $row['service'] ?></div>
       In stock<span class="stock <?php echo $row['code'] ?>"></span><br>
       <div></div>
 </div>
 <?php }
}
?>

我想在从 ajax 请求中获得的每个跨度中插入正确的库存。下面的代码不起作用，它将股票数组中的第一个值插入到所有跨度中。另外我想知道哪种方法可以更有效地在产品表中的页面加载时从 api 插入库存，然后将其全部输出或使用下面的代码通过匹配类名来显示库存，因为库存来自不同的 api .

$.ajax({
        type: 'post',
        url:"stock.php",
       dataType:'json',
       data: {country: $("#selCountry").val()},
        success: function(data, status){
      data = data.map(x => JSON.parse(x));
       console.log(data);
      $(".stock").html(data[0].online);
       var d = document.querySelectorAll('.service span');
       for(i=0; i<d.length; i++) {
        if($('span.stock').hasClass("srv1")) {
          $(".stock").html(data[0].stock);
        }
         if($('span.stock').hasClass("srv41")) {
          $(".stock").html(data[1].stock);
        }
       }
    }
  });

...

data[i].service_name and $row['service']

也可以匹配以从对象的数据数组中确定正确的库存值，但我很困惑如何以及在何处使用它。

标签： jquery

解决方案

您需要以这种方式对 querySelectorAll 进行迭代循环

var d = document.querySelectorAll('.service span');
for(i = 0; i < d.length; i++) {
 if(d[i].hasClass("srv1")) {
     // Get your object from the iterator # d[i]
     // Your Code
 }
}

推荐阅读