Question

我有.ajax（）方法我成功获取每个记录的json响应我得到的时候我需要添加一个按钮，当我们点击它时应该调用另一个函数我该怎么做。

$.ajax({
url: "ajs/index",
type: "GET",
dataType: "JSON",
success: function(data) {  
  var output=""
      for(i=0;i<data.length;i++)
    {
           output += "name" + data[i].name
                  + "title: " + data[i].title
                  + "content: " + data[i].content
                  + "<input type='submit' class='delete' value='Delete' onclick='deleterecord("+data[i].id+");'><br>"


    }
     $("#result").html(output);
     $('#result').on('click', '.delete', deleterecord(id){
       alert("test")
       $.ajax({
                    url: "ajs/",
                    type: "DELETE", 
                    data: "22",     
                    dataType: "html",
                    success:function(data) { 
                        alert("success")
                    },
                    error: function(){
                        alert("error")
                    }
                });
   }   //success function closed
 });

所以当我点击那个成功功能的删除按钮时，我需要调用另一个功能。我在ajax调用按钮之外创建了一个函数“delete record（）”，它没有响应。任何人帮助我。

Answer 1

首先，您需要在要将数据添加到;的行的末尾放置一个分号output。

我使用类来引用单击处理程序，而不是将onclick事件绑定到每个元素。您还在HTML中无法复制ID ，这可能会导致您遇到问题。再次，在这里使用类。

最后，由于每次迭代时都要连接数组的结果，所以应该在循环之后而不是在循环中设置#result的HTML。它最终会看起来一样，但你会得到一些无用的调用，这只会减慢处理时间。

试试这个：

var output = '';

for(i = 0; i < data.length; i++) {
    output += "name" + data[i].name
           + "title: " + data[i].title
           + "content: " + data[i].content
           + "<input type='submit' class='delete' value='Delete'><br>";
}

$("#result").html(output);

然后使用delegated approach而不是直接定义您的点击处理程序：

$('#result').on('click', '.delete', deleterecord);

要解释上面发生的情况，您正在侦听源自#result元素的点击，并发生在包含删除类的元素上，当它们发生时，您正在调用deleterecord()。此方法侦听DOM的原始创建，其中直接事件不会，并且每次创建新元素时都需要重新绑定。 click()是直接事件的一个很好的示例，live('click', function() {})是委托事件的弃用示例。

我认为你的deleterecord()函数中正在处理这个问题，因为你使用了多个提交按钮，你应该返回false或者使用preventDefault()等来停止提交表单正常。如果您还没有考虑的事情......如果这不是您的意思，请更改<button type="button" class="delete">Delete</button>的输入，默认情况下不会将您的浏览器发送到任何位置。

如何调用按钮上的功能点击按钮是.ajax的成功方法

1 个答案: