Question

通过MongoDB文档$(document).ready(function()..) loops进行JQUERY AJAX调用，并将HTML Div添加到带有.get

的页面

每个Div中包含<button type='button' id='deleteItem' class='close' onClick='deleteThisItem(" + i + ")' aria-hidden='true'>×</button>"

每个Div还有一个表单字段，隐藏值用于返回文档_id，然后在Express / Node.js中使用以查找和删除正确的文档（这在另一个应用程序中有效..）

"..<form name='theForm' id='theForm" + i + "'>
<input type='hidden' name='iD' id='iD' value='" + doc._id + "'>.."

我希望让button使用AJAX删除MongoDB doc onClick .post

      // handle DELETE (x) button clicks     
    $('#deleteItem').click(function(i) {

      number = i;
      alert(number);

      // make an ajax call
      $.ajax({
        dataType: 'json',
        data: $('#theForm' + number).serialize(),
        type: 'POST',
            url: "http://localhost:9999/delete",
            success: gotAllSuccess,
            error: gotAllFailure
        });

    });

尝试使用全局变量（不理想）var number = 0;，通过$(document).ready(function()..)之外的函数传递i参数，并一直在研究回调技术来回调ajax，但没有做任何事情欺骗..

function deleteThisItem(i)
{
  number = i;
  alert(number);

  //some callback to the Jquery in the ready doc?       
}

Answer 1

由于您有多条记录，因此不要对按钮使用id，因为元素的id必须是唯一的，请使用class属性对它们进行分组。此外，不需要内联点击处理程序

<button type='button' class='close deleteItem' data-id='" + i + "' aria-hidden='true'>&times;</button>

然后使用委托事件处理程序，如

jQuery(function ($) {
    $(document).on('click', '.deleteItem', function () {
        var $this = $(this);
        var number = $this.data('id');
        alert(number);

        // make an ajax call
        $.ajax({
            dataType: 'json',
            data: $('#theForm' + number).serialize(),
            type: 'POST',
            url: "http://localhost:9999/delete",
            success: gotAllSuccess,
            error: gotAllFailure
        });

    });
})

将参数传递给选择器以进行Ajax调用onClick？

1 个答案: