jQuery Datepicker onSelect事件获取类

我试图在用户点击日期时在jQuery beforeShowDay函数中设置类。 像这样的东西：

 $("#calendar").datepicker({ minDate: today, dateFormat: dateformat, beforeShowDay: function(date) { // set all the dates to have reserved class for now return [true, 'reserved', 'this date reserved']; }, onSelect: function(date, el){ if ($(el).hasClass('reserved')){ // on click, check if reserved class exists. console.log('it is reserved!'); } else { console.log('it is not reserved'); } } }); 

每次点击都会返回“未保留”。 如何检查点击元素的类？

http://jsfiddle.net/sf90zw72/

Answer 1

不幸的是，它比这更难，你得到的el参数是一个包含datePicker实例的对象，而不是文档中点击的元素

…将所选日期作为文本，将datepicker实例作为参数接收。

只有选定的日期和父Datepicker元素包含在该对象中，因此您必须使用这些属性来选择元素并检查类。

请注意，在您的示例中，所有日期都将reserved类，因为没有条件，但我假设在实际代码中有所不同

 (function ($) { $(document).ready(function () { $("#calendar").datepicker({ dateFormat: 'yyyy-mm-dd', beforeShowDay: function (date) { return [true, 'reserved', 'this date reserved']; }, onSelect: function (date, el) { var day = el.selectedDay, mon = el.selectedMonth, year = el.selectedYear; var el = $(el.dpDiv).find('[data-year="'+year+'"][data-month="'+mon+'"]').filter(function() { return $(this).find('a').text().trim() == day; }); if ( el.hasClass('reserved')){ console.log('it is reserved!'); } else { console.log('it is not reserved'); } } }); }); })(jQuery); 

小提琴

Answer 2

我认为它可以像这样简单：

  $jx('.date-picker').datepicker({ onSelect: function(dateText, $el) { if ($jx(this).hasClass('start-date')) { console.log('...'); } } });