更新

Question

我有一个使用PHP生成的表。

当表格从php输出中填充时，它会生成以下几个实例：

<td>
<div id="costSpin">  
   <strong><? = $cost ?></strong><br>
</div> 
</td>

我会在页面上有人更新内容的时候利用这个costSpin div - 当成本刷新时，他们会看到一点点微调。

当调用脚本来刷新定价时，会执行以下操作：

$("#costSpin").load("spinner.html");

   $.ajax({
      //code to refresh...
   });

甜。这有效。我唯一的问题是，如果终极表有10行，只有第一行显示微调器。

<td>
<div id="costSpin">  
   <strong><? = $cost ?></strong><br> <!-- spinner works -->
</div> 
</td><td>
<div id="costSpin">  
   <strong><? = $cost ?></strong><br> <!-- spinner doesn't work -->
</div> 
</td><td>
<div id="costSpin">  
   <strong><? = $cost ?></strong><br> <!-- spinner doesn't work -->
</div> 
</td><td>
<div id="costSpin">  
   <strong><? = $cost ?></strong><br> <!-- spinner doesn't work -->
</div> 
</td>

我假设那是因为<div>只能使用一次？我不确定是什么原因引起的。我希望我可以让微调器加载到<div>的每一个中。我做错了什么？

更新

由于使用PHP填充表格是很常见的事情，如果这对其他人有帮助，这是我使用的最终代码：

$ x是一个唯一的标识符，随着每一行的创建而增长....

<div class="costSpin<?= $x ?>">

这是调用JavaScript函数的代码：

<select style="width: 230px" class="btn btn-danger btn-sm" datax="<?= $x ?>" onChange="selectCustomerCMR(this)">

和脚本本身：

var x = select.getAttribute("datax");
$(".costSpin" + x).load("spinner.html");

这一切都确保了类的每个实例仍然具有唯一的名称，因此它们最终成为

costSpin1
costSpin2
costSpin3
costSpin4

然后，只要加载微调器，就只会对该特定行的costSpin div进行操作。

Answer 1

您有重复的id属性无效，因为id在页面中必须是唯一的。删除id并改为使用公共类：

<td>
    <div class="costSpin">  
       <strong><? = $cost ?></strong><br>
    </div> 
</td>

然后修改你的选择器：

$(".costSpin").load("spinner.html");

填充相同#DIV的多个实例

更新

1 个答案: