想摆脱冒泡事件

Question

我正在尝试使用 jquery 进行确认部分。我有一个显示确认消息的取消按钮。然后再次单击是和否的确认按钮。

这是我的脚本的 jsfiddle：http://jsfiddle.net/jogesh_pi/TVfM9/

首先点击取消然后你得到是和否按钮，按否显示你的第一个统计是取消按钮，然后再次点击取消，然后按是，是显示警报消息，但气泡警报框一样多时间我们不刷新就试了，希望你理解，

谁能告诉我我错过了什么？

$('input[name="cancel_upload"]').click(function(e){

            e.preventDefault();
            e.stopPropagation();

            var that    = $(this), 
                s_t     = $('.status'),                    
                c_b     = $('#cncl'),                
                c_c     = $('#cncl-conf'),                
                c_y     = $('input[name="cancel_y"]'),      
                c_n     = $('input[name="cancel_n"]');      

            c_b.hide();
            c_c.show();
            s_t.html('Cancel Transfer')
               .next()
               .hide();

            //Trigger Handle
            var combo = c_y.add(c_n);
            combo.click(function(e){
                e.preventDefault();
                e.stopPropagation();

                if(e.target.name == 'cancel_n')
                {
                    c_b.show();
                    c_c.hide();
                    s_t.html('Transferring...')
                       .next()
                       .show();
                } 
                else
                {
                    alert('Going to Cancel');
                    c_b.show();
                    c_c.hide();
                    s_t.html('Transferring...')
                       .next()
                       .show();
                }

            });

            return false;
});

Answer 1

此问题与事件冒泡无关，这是因为您在每次单击取消按钮时注册了重复的事件处理程序

您不应该在不删除之前的处理程序的情况下在另一个事件处理程序中注册一个事件处理程序。

在这种情况下，我建议在点击处理程序之外添加事件处理程序

试试

var  s_t     = $('.status'),                    
    c_b     = $('#cncl'),                
    c_c     = $('#cncl-conf'),
    c_y     = $('input[name="cancel_y"]'),      
    c_n     = $('input[name="cancel_n"]');


//Trigger Handle
var combo = c_y.add(c_n);
combo.click(function(e){
    e.preventDefault();
    e.stopPropagation();

    if(e.target.name == 'cancel_n')
    {
        c_b.show();
        c_c.hide();
        s_t.html('Transferring...')
        .next()
        .show();
    } 
    else
    {
        alert('Going to Cancel');
        c_b.show();
        c_c.hide();
        s_t.html('Transferring...')
        .next()
        .show();
    }

});

$('input[name="cancel_upload"]').click(function(e){

    e.preventDefault();
    e.stopPropagation();

    var that    = $(this);      

    c_b.hide();
    c_c.show();
    s_t.html('Cancel Transfer')
    .next()
    .hide();

    return false;
});

演示：Fiddle