Jquery, click 事件嵌套 click 的问题！抓狂中！！求办法！！

代码简单来说如下：

$('.menu_button'). click(function(){              // 外部click
    var parent = $(this).parent().attr('id');
                 // 此处省略了显示pop_menu的代码

            $(".pop_menu_edit"). click(function(){     // 内部click!
                $('<p>').text(parent).appendTo(edit_div);
                edit_div.dialog({show: "slow"});
    });
});

其中， pop_menu_edit, edit_div都是函数外定义好的。 pop_menu_edit 不在menu_button所在的div中。
menu_button类的按钮有4个。

希望的效果是：
每次click一个button, 然后click该button弹出的pop_menu中的一项，显示edit_div这个对话框。对话框里面是当前button的id.

出现的效果是：
可以显示edit_div这个对话框，但是对话框中的内容是点过的所有button的id列表.
如果clickl了button1, 然后弹出对话框，显示id = button1,
如果此后点击 button 2, button 3,则会显示 id =  button 1, id = button 2, id = button 3

分析的问题：
每次click button, 都会注册一个click 方法。当点击内部的click时，parent 变量就会显示出所有点过的button 的 id。

试过的方法：
添加 event.stopPropagation()在内部的click方法中，不管用！！！！！

怎么修改啊？！！！It Drives me CRAZY!!!!!! 求大神赐教！！！！！！

5 个解决方案

#1

问题是！为什么 dialog那个对话框不会打开很多遍呢！！！！无论点击多少次button,每次都只有一个对话框！！！

#2

给pop_menu_edit绑定事件放到外面来，你放到里面每click一次menu_button就给pop_menu_edit绑定一次，导致多次绑定，点击一次pop_menu_edit就会打开多个dialog了，要不就需要移除绑定的时间先
$('.menu_button').click(function(){              // 外部click
    var parent = $(this).parent().attr('id');
                // 此处省略了显示pop_menu的代码

            $(".pop_menu_edit") .unbind('click').click(function(){     // 内部click!
                $('<p>').text(parent).appendTo(edit_div);
                edit_div.dialog({show: "slow"});
    });
});

#3

jquery有一个once方法是绑定一次事件的

#4



内部click方法改为

$(".pop_menu_edit")[0].onclick = function(){

    $('<p>').text(parent).appendTo(edit_div);

    edit_div.dialog({show: "slow"});	

});

其实你完全可以不用每次都注册事件，把pop_menu_edit的click事件定义在外面，
在edit_div前添加代码如下：



<input type="hidden" id="parent"/><p rel="parent"><p>

js改成如下



$('.menu_button').click(function(){

    var parent = $(this).parent().attr('id');

    $(".pop_menu_edit #parent").val(parent);

    // 此处省略了显示pop_menu的代码

});

                

$(".pop_menu_edit").click(function(){

   $("p[rel=parent]").html($("#parent").val());

   edit_div.dialog({show: "slow"});	

});

#5

在你不想触发的事件用event.preventDefault()试试

#1