如何将PHP变量从链接传递给jQuery ajax函数

Question

我想将链接中的两个变量传递给我的jQuery Ajax函数。但我不知道如何做这些Ajax的东西。

我有两个ID的链接。 1. rowid & 2nd。 BOOKID。 我必须将这两个id传递给我的jquery函数。

请帮我，我该如何做到这一点。

`//cart item displaying in a for each loop , each row have a 'remove' link with two id 
//say i have $id='4dsf2323' & $bid='43' now i have to pass these two ids to my jquery function on click of a link  


<a id="removeid" >Remove item from cart link</a>` 

我的jQuery函数

<script> 
     $('removeid').click(function(e) { 
     // prevent the default action when a nav button link is clicked 
     e.preventDefault(); 

       //HOW TO GET HERE THOSE TWO IDS FROM MY ABOVE LINK ON CLICK EVENT 

     // ajax query to retrieve the HTML view without refreshing the page. 
     $.ajax({ 
     type: 'get', 
     url: '/path/to/your/controller/method', 
     dataType: 'html', 
     success: function (html) { 
      // success callback -- replace the div's innerHTML with 
      // the response from the server. 
      $('#yourDiv').html(html); 
     } 
     }); 
    }); 

    </script> 

***********更新************** 输出看起来像这样

Answer 1

如何使用jQuery's .data() functionality？添加HTML这样的：

<a id="removeid" data-id="<?php echo $id;?>" data-bid="<?php echo $bid;?>">Remove item from cart link</a> 

然后用。数据（）这样的检索：

$('removeid').click(function(e){ 
    e.preventDefault(); 

    var $aid = $('#removeid'), 
     id = $aid.data('id'), 
     bid = $aid.data('bid'); 

    // rest of the ajax stuff that uses the data 
}); 

应该工作得很好，as long as you don't use camelCase。

编辑，因为显然删除链接是在一个循环，他们有相同的ID？

与类设置你的项目：

<a class="RemoveClass" data-id="<?php echo $id;?>" data-bid="<?php echo $bid;?>">Remove item from cart link</a> 

然后使用$（本）点击函数内只捕获的项目点击的数据值：

$('.RemoveClass').on('click',function(e){ 
    e.preventDefault(); 

    var $this = $(this), 
     id = $this.data('id'), 
     bid = $this.data('bid'); 

    // rest of the ajax stuff that uses the data 
}); 

如果你正确地做到了这一点，它将本地化​​为已被点击的链接。

作为便笺，我已将语法更改为更通用的.on()事件处理程序。如果你想在将来做某件事，比如悬停事件或其他东西，你可以使用相同的.on（）绑定来包含它，而不是为不同的事件创建一个单独的绑定。

Answer 2

的数据传递到链接与数据属性：

  <a id="removeid" data-bid="<?=$bid?>" data-id="<?=$id?>" >Remove item from cart link</a> 

和你的jQuery JavaScript的应该是这样的：

$('removeid').click(function(e) { 
     // prevent the default action when a nav button link is clicked 
     e.preventDefault(); 
     var id = $.data(this,'id'); // or $(this).attr('data-id'); 
     var bid = $.data(this,'bid'); // or $(this).attr('data-bid'); 

     // ajax query to retrieve the HTML view without refreshing the page. 
     $.ajax({ 
      type: 'get', 
      url: '/path/to/your/controller/method', 
      data: {bid:bid,id:id} 
      dataType: 'html', 
      success: function (html) { 
      // success callback -- replace the div's innerHTML with 
      // the response from the server. 
      $('#yourDiv').html(html); 
     } 
    }); 
}); 

，或者你可以指定整个URL的链接的href属性和刚：

<a id="removeid" href="/path/to/your/controller/method?bid=<?=$bid?>&id=<?=$id?>" >Remove item from cart link</a> 

和JS成为：

$('removeid').click(function(e) { 
     // prevent the default action when a nav button link is clicked 
     e.preventDefault(); 

     // ajax query to retrieve the HTML view without refreshing the page. 
     $.ajax({ 
      type: 'get', 
      url: $(this).attr('href'), 
      dataType: 'html', 
      success: function (html) { 
      // success callback -- replace the div's innerHTML with 
      // the response from the server. 
      $('#yourDiv').html(html); 
     } 
    });