2013-06-28 38 views
0

我想用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; 
}); 

回答

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

+0

姆,我想這一點。但我雖然可能是我找到了一些解決方案。 –