Question

在我的情况下：

我想要从ajax调用启用的日子。当我改变月份时，我读了一个叫做ajax的xml文件，并得到那个月的日子。如何实现它？

非常感谢你！

用于保存日期的数组变量：

var $daysWithRecords = new Array()

加载xml文件的功能：

function getDays(year,month){

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

     });
}

初始化days数组的函数：

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];
}

datepicker部分代码加载并显示天数[注意：我使用的是datepicker的内嵌模式]

$('#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

救命！如何在月份更改后的UI datepicker中启用日期？

1 个答案: