2012-02-20 114 views
3

我有一個特定的類的div,我委派了一個點擊事件,所以當它被點擊我切換其類與另一個,並打開一個對話框,現在當對話框正在關閉,我切換到原始關閉對話框後關閉對話框後按ESC鍵(僅鉻)

現在到有趣的部分...如果我按鍵盤上的esc鍵類繼續切換。 ..這種情況只在Chrome瀏覽器

說明重現: 在Chrome中: 點擊DIV - >對話會開 - >關閉 - >啓動按Esc鍵按鈕 - 的顏色正在執行格將被更改的原因的對話框關閉功能(這導致格類切換)

在FF和IE它工作得很好,並沒有ESC的問題存在

這裏是js代碼段

$(document).ready(function() { 
    $(document).delegate(".dashboard_widget", "click", function(){ 
    $(this).toggleClass('dashboard_widget').toggleClass('dashboard_widget_clicked'); 
    showDialog(); 
    }); 

}); 
function showDialog(){ 
    $("#dialogID").dialog({ 
     buttons: { 
      Close: function() { 
       $(this).dialog("close"); 
      } 
     }, 
     close: function (event, ui) { 
      $("#myID").toggleClass('dashboard_widget_clicked').toggleClass('dashboard_widget'); 
     } 
    }); 
} 
提前

I reproduced it in jsfiddle

感謝,

丹尼爾。

回答

2

解決它,這要歸功於羅裏的想法

設置。數據與假/真爲了知道何時對話框打開/關閉

這裏是代碼(JS)

的主要片段
$(document).ready(function() { 
    $(document).delegate(".dashboard_widget", "click", function(){ 
    $(this).toggleClass('dashboard_widget').toggleClass('dashboard_widget_clicked'); 
    showDialog(); 
    }); 

}); 
function showDialog(){ 
    $("#myID").data('closed',false);  
    $("#dialogID").dialog({ 
     buttons: { 
       Close: function() { 
        $(this).dialog("close"); 
       } 
      }, 
     close: function (event, ui) { 
      if($("#myID").data('closed')!==true){ 
       $("#myID").toggleClass('dashboard_widget_clicked').toggleClass('dashboard_widget'); 
       $("#myID").data('closed',true); 
      } 
     } 
    }); 
} 

jsfiddle Full Solution

+0

後面提供解決方案很好的解決方法。這可能是值得提出你與jQueryUI開發者的問題。 – 2012-02-20 12:38:52

1

這是因爲escape鍵附加到對話框的close方法。因爲你已經將你的toggleClass掛鉤了這個方法,所以在每次按鍵時改變這個類。

當對話框沒有打開時,Firefox和IE似乎忽略了esc按鍵,因此Chrome沒有這個問題。

不改變插件的代碼我不認爲有很多可以解決這個問題。

+0

TNX的信息......它給了我一個想法......將使用。數據來,如果打開的對話框中,以告訴FALE與/真設置它,並在案件關了d我不會執行關閉代碼塊,在jsfiddle – Daniel 2012-02-20 12:10:12