Question

为什么我的ajax只能在while循环中获取第一项数据？

示例：首先使用循环产品ID = 64中的第一项添加到心愿单，当我添加另一项时，产品ID始终为64。

我的代码：

<a id='addtowishlist' class='link' href='#' data-data='".$rows['p_id']."'>Add to wishlist</a>

<script type="text/javascript">
$(document).ready(function(){
        $("#addtowishlist").live('click', function(evt) {
        var link_data = $('.link').data('data');
        $.ajax({
            type: "POST",
            url: 'addtowishlist.php',
            data: ({product_id: link_data}),
            success: function(data) {
                alert(data);
            }   
        });   
    });  
});
</script>

Answer 1

ID必须是唯一的。否则请改用class。如果您对ID使用相同的名称，则仅返回第一个匹配的数据。请尝试以下代码：

这应该定义为类（删除id属性）：

<a class='addtowishlist link' href='#' data-data='".$rows['p_id']."'>Add to wishlist</a>

而且：

<script type="text/javascript">
$(document).ready(function(){
    // use class selector instead of ID
    $(".addtowishlist").live('click', function(evt) {
       // take only current clicked data element
       var link_data = $(this).data('data');
       $.ajax({
          type: "POST",
          url: 'addtowishlist.php',
          data: ({product_id: link_data}),
          success: function(data) {
            alert(data);
          }   
       });   
    });  
});
</script>

Answer 2

在你的html中使用class而不是id

<a class='addtowishlist' class='link' href='#' data-data='".$rows['p_id']."'>Add to wishlist</a>

并更改ajax的语法

<script type="text/javascript">
$(document).ready(function(){
    // use class selector instead of ID
    $(".addtowishlist").live('click', function(evt) {
       // take only current clicked data element
       var link_data = $(this).data('data');
       $.ajax({
          type: "POST",
          url: 'addtowishlist.php',
          data: ({product_id: link_data}),
          success: function(data) {
            alert(data);
          }   
       });   
    });  
});
</script>

Ajax只在while循环中获取数据的第一项

2 个答案: