Question

由于我目前正在开发一个包含某些产品集成的日历系统，因此我希望能够查看日历中是否有附加到该事件的产品。

目前我有这个功能打开一个文件并发送一个ID来获取产品名称，但问题是如果页面上有多个<div id="productX"></div>（用产品ID替换x），那么它只替换它找到的第一个div标签。

function getProductname(id){
$.ajax({
    type: 'GET',
    url: 'http://XX.com/api/calendar_getname.php',
    data: 'id=' + id,
    success: function(data) {
        $('#product' + id).html(data);
    }
});

};

有什么方法可以让它替换页面周围多个相同的div标签吗？就像它找到<div id="product0">X</div> 2个项目一样，用它从页面获取的值替换它。

希望在某些方面可以理解。

Answer 1

ID对于一个元素是唯一的，您应该使用一个类，然后将其作为目标

<div class="productX"></div>

Answer 2

替换它：

$('#product' + id).html(data);

由此：

$('[id="product"'+id+']').html(data);

Here is a JSFiddle demo

Answer 3

我建议你有像

这样的div

<div class='product'></div>

但是如果你坚持使用Id，那么仍然可以通过使用

来实现

Starts With Selector

$('#b1').click(function() {
  $('div.product').html('By Class');
});

$('#b2').click(function() {  
  // Get all div which id starts with product.
  $('div[id^="product"]').html('By ID');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="product1" class="product"></div>
<div id="product2" class="product"></div>
<div id="product3" class="product"></div>
<div id="product4" class="product"></div>
<button id="b1">By Class</button>
<button id="b2">By ID</button>

javascript替换多个div标签

3 个答案: