jQuery-ui对话框自定义按钮在单击后保持ui-state-active

Question

我正在尝试将一些样式应用于jQuery-ui对话框的按钮。我所经历的是，按下一个按钮并将鼠标移出按钮区域（如拖动）后，该按钮将保持ui-state-active类。如何有效地删除按钮的ui-state-focus和ui-state-active类？

我在公开赛中这样做：

open: function(event, ui) { 
    $('.ui-dialog-titlebar-close', ui.dialog).hide(); 
    $('.ui-dialog-buttonpane button').removeClass().addClass('button white').on('mouseover', function() { 
        $(this).removeClass('ui-state-hover'); }).on('mouseup, mousedown, mouseenter, click', function() { 
            $(this).removeClass('ui-state-focus ui-state-active'); 
            }); 
        }

Fiddle here （先单击并拖动“是”按钮，然后症状也会出现在“否”按钮上）

Answer 1

您可以销毁按钮上的所有事件并应用自己的事件。像这样：

open: function(event, ui) { 
   $('.ui-dialog-titlebar-close', ui.dialog).hide(); 
   $('.ui-dialog-buttonpane button').off().on({
       blur: function() {
          ..do what you want..
       },
       focus: function() {
          ..do what you want..
       },
       click: function() {
          ..do what you want..
       },
       etc.
  })
}