将类添加到jQuery datepicker

Question

我有一个css网页，它改变了默认的TABLE布局。

TABLE:not(.base) { 
    border-spacing: 0; 
    border-style: none; 
    border-collapse: collapse; 
} 

TABLE:not(.base) > * > TR > * { 
    border: 0.2rem solid #88F; 
    padding: 0 0.375rem 0 0; 
    vertical-align: top; 
} 

... 

我想使用JQuery的日期选择器，但它使用表构建标记，最终得到一些丑陋的东西。 我想将“.base”添加到所有这些表中，但我找不到正确执行此操作的方法。

这是我到目前为止所尝试的。

$(document).ready(function() { 
    var formatCal = function (elt) { 
     alert(elt); 
     elt.find('TABLE').addClass('base'); 
    } 

    $('#divCal').datepicker({ 
     beforeShow: formatCal 
     , onSelect: function (val) { 
      alert(val); 
     } 
    }); 

    formatCal($('#divCal')); 
}); 

但是每次我选择日期时，datepicker都会重绘（不带.base类）。

怎么办？

Answer 1

我将使用MutationObserver。

$(document).ready(function() { 
    var formatCal = function (elt) { 
     elt.find('TABLE').addClass('base'); 
    } 

    $('#divCal').datepicker({ 
     beforeShow: formatCal 
     , onSelect: function (val) { 
      alert(val); 
     } 
    }); 

    formatCal($('#divCal')); 

    var observer = new MutationObserver(function (records) { 
     var record = records[0]; 

     formatCal($(record.target)); 
    }); 

    // Configuration of the observer: 
    var config = { 
     attributes: false, 
     childList: true, 
     characterData: false 
    }; 

    // Pass in the target node, as well as the observer options 
    observer.observe($('#divCal > *').get(0), config); 
});