Question

我有一个页面，它从后端系统中提取订单状态，然后在页面上显示状态更新。 我需要动态加载页面，因为现在页面需要很长时间才能立即更新。

我的代码正常工作，以便首先加载HTML页面，然后在页面上加载单个状态更新。

组件：

index.php -page - 基本页面w。请求orders_updatestatus.php。
orders_updatestatus.php -page。从后端系统中提取信息并显示信息。通过GET接收要更新的订单。

HTML（index.php - 这可行）

<div id="updateref"></div>

jQuery :( index.php的一部分 - 这有效）

<script type="text/javascript">
// Update order status
$(function () {
  $.ajax({
    url: 'orders_updatestatus.php?reference=100000025',
    success: function (data) {
      $('#updateref').html(data);
    }
  });
});
</script>

更新代码

我的想法是，我需要为每个订单创建一个div，以便它们可以单独更新。

$results = $mysqli->query("SELECT reference FROM orders;");
while($row = $results->fetch_assoc()) {
  print '<div id="updateref'.$row['reference'].'"></div>';
}

所以，使用上面的代码，我会这样：

<div id="updateref20000"></div>
<div id="updateref20001"></div>
<div id="updateref20002"></div>
<div id="updateref20003"></div>
<div id="updateref20004"></div>
etc..

到目前为止，一切都很有效。现在我需要你的帮助来构建相应的jQuery代码，以便它更新它看到的每个'updaterefXX'-div。

我的问题是：如何更新以下代码，以便在页面上更新每个updateref -div：

<script type="text/javascript">
// Update order status
  $(function () {
    $.ajax({
      url: 'orders_updatestatus.php?reference=100000025',
      success: function (data) {
        $('#updateref').html(data);
      }
    });
  });
</script>

更新/澄清：我需要的是脚本为每个div提取带有GET变量的orders_updatestatus.php。例如：

使用<div id="updateref1000">脚本请求orders_updatestatus.php?reference=1000并在准备好后将其显示在<div id="updateref1000">

使用<div id="updateref1001">脚本请求orders_updatestatus.php?reference=1001并在准备好后将其显示在<div id="updateref1001">

等。谢谢！

Answer 1

您可以使用属性开头的选择器和.each()来迭代所有以id "updateref"开头的.replace()元素，以替换id的{{1}}部分不是要在查询字符串中设置的数字，请设置.innerHTML success回调$.ajax()回调中的当前元素

 $("[id^=updateref]").each(function(index, element) {
   $.ajax({
     url: "orders_updatestatus.php?reference=" + element.id.replace(/\D/g, ""),
     success: function(data) {
       element.innerHTML = data;
     }
   });
 })

使用单个jQuery脚本更新多个DIV - 标记

1 个答案: