Question

我有一个包含3行的表格。每行有3 td。每行的前2个td都有默认值。每行的最后一个td没有值，但是一个名为letter的属性和一个名为loader的类。在我的桌子上方，我有一个按钮。我想要做的是如下。单击该按钮时，将为每个具有加载程序类的td发送ajax调用。通过调用发送的ajaxData应该是属性字母的值。我知道如何进行ajax调用，但不能同时为类的所有元素启动它。看看jsFiddle，更好地了解我在寻找什么。希望有人能提供帮助。提前感谢您的回复。干杯。马克。

http://jsfiddle.net/sp6JA/

我的HTML：

<input type="submit" id="load" value="click here to load last td with its attribute called letter" />

<table>
  <tr>
    <td>td1</td>
    <td>td2</td>
    <td class="loader" letter="A"></td>
  </tr>
    <tr>
    <td>td4</td>
    <td>td5</td>
    <td class="loader" letter="Q"></td>
  </tr>
    <tr>
    <td>td7</td>
    <td>td8</td>
    <td class="loader" letter="M"></td>
  </tr>
</table>

我的JS：

$(document).on({
    click: function() {

        var ajaxData = "";

        $.ajax({
            type: "POST",
            url: "myfile.php",
            data: ajaxData,
            success: function(return) {

                $('.loader').html(return);

            }
        });

    }

}, "#load");

Answer 1

如果要发送单个Ajax请求，每个单元一个，并将响应放回适当的单元格，那么您可以使用.each()循环：

$(document).on({
    click: function() {

        $(".loader").each(function() {
           var $this = $(this),
               ajaxData = "";

           $.ajax({
               type: "POST",
               url: "myfile.php",
               data: ajaxData,
               success: function(return) {
                  $this.html(return);
               }
           });
        });
    }

}, "#load");

请注意，在循环中，您需要保存对当前元素的引用，以便您可以从Ajax成功处理程序更新它。

Jquery - 如何为类的所有元素发送ajax调用

1 个答案: