3

我正在制作一个编辑按钮，它会弹出一个带有表单的模式框来编辑它。然后 jQuery 将此表单发送到我的服务器，我得到一个 JSON 响应。但是，由于我的冒泡问题，例如，如果我单击所有编辑按钮，然后单击最后一个并更改一个字段，它会在所有这些按钮上执行此操作。

$('.edit').click(function(event){
 //more code...
    modal_submit(the_id);
    event.stopPropagation();
});

然后提交事件：

function modal_submit(the_id){
$('#modal form').submit(function(){
    //This will alert every time I have EVER clicked on an edit button
    alert(the_id);
    return false;
});

}

最后，所有这些都在 getScript 中：

$.getScript('js/edit.js',function(){
create_edit_btn();

});

我只用过这 1 次，它起作用了，但我也必须这样做。之前为我做过的另一个脚本工作过。

有没有人有任何想法？:\

编辑：

the html is: 
<li> 
  <input id="item1" type="checkbox" value="webhosting|15" title="Web Hosting">  
    <p>Hosting for your web site</p>
</li>
4

3 回答 3

3

一个事件可以有多个事件监听器。每次使用 $(element).submit(whateverFunction) 时，您都会向提交事件添加另一个whateverFunction。如果您只希望最后一个侦听器是在调用事件时执行的操作，请尝试执行以下操作：

function modal_submit(the_id){

$('#modal form').unbind(); // this will remove all other event listeners from this element

$('#modal form').submit(function(){
        //This will alert every time I have EVER clicked on an edit button
        alert(the_id);
        return false;
});
于 2009-07-25T02:05:16.930 回答
2

我认为你 event.stoppropagation 已经完成了它的工作。它停止了按钮单击事件的所有冒泡（即，如果您尝试检查文档正文，它将不再有鼠标单击事件）。之所以仍然执行表单提交中的代码，是因为这是由按钮的默认操作调用的。

连同 event.stoppropagation()，我建议你包括这个：

event.preventDefault();

这样就不会使用默认操作，只会执行处理程序中的代码。

于 2009-07-25T02:04:08.447 回答
0

这是在创建编辑按钮的功能中吗？

$('.edit').click(function(event){
 //more code...
        modal_submit(the_id);
        event.stopPropagation();
});

如果是这样，那么它将多次将此处理程序添加到相同的元素，从而引起一连串的警报。使用live，它将处理程序放置在每个匹配的元素上，即使稍后在执行中添加。

于 2009-07-25T01:51:40.833 回答