帮助！更改月份后如何在 UI 日期选择器中启用日期？

Question

在我的情况下：

我得到了想要从 ajax 调用的日子。当我更改月份时，我读取了 xml 文件小瓶 ajax 并得到了该月的日期。如何制作出来？？

非常感谢！！

保存日期的数组变量：

var $daysWithRecords = new Array()

加载xml文件的函数：

function getDays(year,month){

    $.ajax({
        type: "GET",
        url: "users.xml",
        dataType: "xml",
        success:function(msg)
        {
           initDaysArray( $(msg) , year ,  month );
        }

     });
}

初始化天数组的函数：

function initDaysArray( $xml , year , month )
{
    //alert(year+'-'+month);
    var dateToFind = year+'-'+month;

    var $myElement = $xml.find( 'user[id="126"]' );

    dates = ''; 
    $myElement.find('whDateList[month="'+dateToFind+'"]').find('date').each(function(){

        $daysWithRecords.push(dateToFind+$(this).text());
        dates += $(this).text() + ' ';

    });


    console.log(dates);
    console.log($daysWithRecords.length)
}

使日期在数组变量中可用的函数：

function checkAvailability(avalableDays){

var $return=false;
var $returnclass ="unavailable";

$checkdate = $.datepicker.formatDate('yy-mm-dd', avalableDays);

for(var i = 0; i < $daysWithRecords.length; i++){ 

       if($daysWithRecords[i] == $checkdate){

            $return = true;
            $returnclass= "available";
        }
    }

    return [$return,$returnclass];
}

加载和显示日期的日期选择器部分代码[注意：我使用的是日期选择器的内联模式]

$('#div').datepicker({ dateFormat: 'yy-mm-dd',defaultDate: '2010-09-01' , 
          onChangeMonthYear: function(year, month, inst) { 
              console.log(year);
              console.log(month);
              getDays(year,month);

          } , 
          beforeShowDay: checkAvailability

        });

最后是我的 xml 文件：

<?xml version="1.0" encoding="utf-8"?>
<users>
    <user id="126">
        <name>john</name>
        <watchHistory>
            <whMonthRecords month="2010-10">
                <whDateList month="2010-10">
                    <date>01</date>
                    <date>05</date>
                    <date>21</date>
                </whDateList>
            </whMonthRecords>

            <whMonthRecords month="2010-11">
                <whDateList month="2010-11">
                    <date>01</date>
                    <date>05</date>
                    <date>06</date>
                    <date>07</date>
                    <date>08</date>
                    <date>09</date>
                    <date>12</date>
                    <date>13</date>
                    <date>14</date>
                    <date>16</date>
                    <date>18</date>
                    <date>19</date>
                    <date>21</date>
                    <date>22</date>
                    <date>23</date>
                    <date>24</date>
                    <date>25</date>
                    <date>26</date>
                    <date>29</date>
                </whDateList>
            </whMonthRecords>
        </watchHistory>
    </user>

</users>

非常感谢！！

Answer 1

问题在于这里的日期格式，当您将日期存储为2010-1001 而不是2010-10-01 时，请更改此格式：

$daysWithRecords.push(dateToFind+$(this).text());

到这里：

$daysWithRecords.push(dateToFind+"-"+$(this).text());

You can see it working here.

---

这里还有一个整体更优化的版本，循环更少，没有无限增长的数组：

var daysWithRecords = [];

function initDaysArray( $xml , year , month ) {
  var d = year+'-'+month;
  daysWithRecords = 
    $xml.find('user[id="126"] whDateList[month="'+d+'"] date').map(function() {
      return d+"-"+$(this).text();
    }).get();
}

function checkAvailability(availableDays) {
    var checkdate = $.datepicker.formatDate('yy-mm-dd', availableDays);
    for(var i = 0; i < daysWithRecords.length; i++) { 
       if(daysWithRecords[i] == checkdate){
           return [true, "available"];
        }
    }
    return [false, ""];
}

$('#div').datepicker({ 
  dateFormat: 'yy-mm-dd',
  defaultDate: '2010-09-01', 
  onChangeMonthYear: getDays, 
  beforeShowDay: checkAvailability
});

You can test it here.