Функция закрытия диалога, выполняемого после закрытия диалога после нажатия клавиши ESC (только в Chrome) - PullRequest
Новая
       13

Функция закрытия диалога, выполняемого после закрытия диалога после нажатия клавиши ESC (только в Chrome)

3 голосов
/ 20 февраля 2012

У меня есть div с определенным классом, я делегировал ему событие click, чтобы при его нажатии я переключал его класс с другим и открывал диалог. Теперь, когда диалог закрывается, я переключаю класс divвернуться к оригиналу

Теперь к интересной части ... Если я нажму кнопку esc на клавиатуре, классы продолжат переключаться ... это происходит только в браузере Chrome

Инструкции по воспроизведению: В Chrome: нажмите на div -> откроется диалоговое окно -> закройте его -> начните нажимать кнопку esc - цвет div будет изменен при выполнении функции закрытия диалога (и это приведет к переключению классов div)

В FF и IE все работает нормально, проблем с выходом нет

Вот фрагмент кода 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');
        }
    });
}

Я воспроизвел его в jsfiddle

Спасибо,

Даниэль.

Ответы [ 2 ]

2 голосов
/ 20 февраля 2012

решил это, благодаря идее Рори

установите .data со значением false / true, чтобы сказать, когда диалог открывается / закрывается

вот основной фрагмент кода (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 Полное решение

1 голос
/ 20 февраля 2012

Это потому, что клавиша escape присоединена к методу close диалога.Поскольку вы подключили toggleClass к этому методу, класс изменяется при каждом нажатии клавиши.

Firefox и IE, по-видимому, игнорируют нажатие клавиши esc, когда диалоговое окно не открывается, Chrome этого не делает, поэтомупроблема.

Не изменяя код плагина, я не думаю, что можно многое сделать, чтобы это исправить.

...