0

我正在尝试将两个变量从链接传递到我的 jquery ajax 函数。但我不知道如何做这些 ajax 的东西。

我有两个 id 的链接。1. rowid & 2nd。书号。我必须将这两个 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>

***********更新************** 输出如下所示 在此处输入图像描述

4

2 回答 2

7

如何利用jQuery 的 .data() 功能？像这样添加 HTML：

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

然后像这样使用 .data() 检索：

$('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
});

只要您不使用 camelCase，就应该可以正常工作。

编辑，因为显然删除链接处于循环中并且它们具有相同的 ID？

用一个类设置你的项目：

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

然后在 click 函数中使用 $(this) 来仅捕获所单击项目的数据值：

$('.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() 绑定中，而不是为不同的事件创建单独的绑定。

于 2013-03-05T15:31:17.710 回答
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);
       }
  });
于 2013-03-05T15:35:07.503 回答