jQuery表单处理，我如何重新分配回调函数？

$(function(){ 

$(".mailbutton").click(function() { 
    var email = $(".mailingfield").val(); 
    $.post("/PHP_scripts/mailinglist.php", { email: email }, function(data) { 
     var content = $(data).find("#mailinglistform"); 
     $("#box").empty().append(content); 
    }); 
}); 
});

我用这个来处理的电子邮件地址。如果它在PHP脚本中失败，表单会以'.mailinglistform'的形式发回，并附有一个新的表单和一些解释错误的文本。我遇到的问题是，即使按钮在回调窗体中具有'.mailbutton'类，该按钮也不会对点击进行任何操作。jQuery表单处理，我如何重新分配回调函数？

这是因为jQuery只能第一次识别它？如果是这样，有没有办法在回调中“重新加载”'mailbutton'.click函数？

谢谢！

来源

2012-07-20 joe coleman

你是正确的，因为你只能重新渲染页面的一部分，以前的jQuery的你写不与你重新呈现“新” mailbutton类注册。为了解决这个问题，你应该使用.on()，如：

$(".wrapper").on('click', '.mailbutton', function() { 
    var email = $(".mailingfield").val(); 
    $.post("/PHP_scripts/mailinglist.php", { email: email }, function(data) { 
     var content = $(data).find("#mailinglistform"); 
     $("#box").empty().append(content); 
    }); 
});

在这种情况下，包装需要一个类元素的重新渲染的部分之外（例如“内容”类，也许一类各地你的表单等），以及不断呈现的（即不在ajax调用中重新呈现的）。这会将一个onclick处理程序附加到作为包装类的子类的任何.mailbutton类，无论它们在页面呈现时是否存在，或者稍后将其添加到DOM。

来源

2012-07-20 15:54:48 ernie

$（ “包装”）。在（ '点击'， '.mailingfield'，（）的函数你的意思 $（ “包装”）。在（ '点击'， '.mailbutton'，函数（）其中mailbutton是类的元素，我想点击的功能添加到 – 2012-07-20 16:25:26

是的，对不起 - 固定的那是委派的事件，即在属于包装类将触发功能的儿童mailbutton类的所有点击 – ernie 2012-07-20 16:26:04

。。。这真是太棒了谢谢，也是一个很好的解释。 – 2012-07-20 16:33:43

为此，您可以使用AJAX和JQuery。或者你可以使用用户load()。

$(".mailbutton").click(function() { 
     $.ajax({          
       url: 'api.php', // Put your calling page path here 
       data: "", 
       dataType: 'json', 
       success: function(data) 
       { 
       //do whatever you want to do on success 
       } 
     }); 
    });

来源

2012-07-20 15:53:10 Hardik

使用on绑定点击事件。当控件在回调函数中再次呈现时，其事件将被删除。使用on而不是click可以自动重新绑定事件。

$(function(){ 

    $(".mailbutton").on("click", function() { 
    var email = $(".mailingfield").val(); 
    $.post("/PHP_scripts/mailinglist.php", { email: email }, function(data) { 
     var content = $(data).find("#mailinglistform"); 
     $("#box").empty().append(content);   
    }); 
    }); 
});

来源

2012-07-20 15:53:31 Adil

这似乎已经没有效果， – 2012-07-20 15:56:45

你期待此按钮#mailinglistform的点击？ – Adil 2012-07-20 15:57:51

on（）的特定用法将失败，因为根据文档 “事件处理程序仅与当前选定的元素绑定;它们在您的代码调用.on（）时必须存在于页面上。有关更多详细信息，请参阅Direct和委托事件 - 在@joe coleman的情况下，他需要使用委派的事件。 – ernie 2012-07-20 16:05:00

jQuery表单处理，我如何重新分配回调函数？

回答

相关问题