1

私はここで立ち往生しており、これに関するガイダンスを得たいと考えています。フィードから XML を取得し、いくつかの要素を配列に入れ、jQuery の DatePicker プラグインに渡そうとしています。以下の私のコードはカレンダーを表示していますが、フィードからのイベントは表示していません。Chrome にはエラーや警告も表示されません。何が起こっているのかわからない。どんな援助も大歓迎です。

（私のXML）：

<entry>
    <published>2012-05-29T13:05:53-08:00</published>
    <updated>2012-05-29T13:05:58-08:00</updated>
    <title type="html">
       <![CDATA[ Businesses Get Help With Legal Issues ]]>
    </title>
    <content type="html">
       <![CDATA[ Click the article header for the complete story.
       <!-- /Publications/26674.htm -->
       ]]>
    </content>
    <link rel="alternate" type="text/html" href="/Publications/26675.htm"/>
</entry>

(外部 JS ファイル内):

$(document).ready(function(){

    var events = new Array();
    events = getSelectedDates();

    $("div.datepicker").datepicker({
    beforeShowDay: function(date) {
        var result = [true, '', null];
        var matching = $.grep(events, function(event) {
            return event.published.valueOf() === date.valueOf();
        });

        if (matching.length) {
            result = [true, 'highlight', null];
        }
        return result;
    },
    onSelect: function(dateText) {
        var date,
            selectedDate = new Date(dateText),
            i = 0,
            event = null;

        while (i < events.length && !event) {
            date = events[i].published;

            if (selectedDate.valueOf() === date.valueOf()) {
                event = events[i];
            }
            i++;
        }
        if (event) {
            alert(event.Title);
        }
    }
});
});


function getSelectedDates()
{
    var the_selected_dates = new Array();

    $.ajax(
    {
        url: 'news.xml',
        type: 'GET',
        dataType: 'xml',
        async: false,
        success: function(data)
        {
            $(data).find('entry').each(function(i, entryObj)
            {
                var entryObj = new Object();
                entryObj.eTitle = $('title', this).text();
                entryObj.eDate = $('published', this).text();
                the_selected_dates.push(entryObj);
            });
        }
    });
    return the_selected_dates;
}
4

2 に答える 2

1

このスニペットにはいくつかの問題がありますが、XML を実際に正しく解析していなかった理由eventsは常に空でした。(要素内の要素を検索する前に)各getSelectedDates関数を実行するように関数を変更しました。eachentryentryentry

function getSelectedDates() {
    return $(data).map(function() {
        return {
            title: $('title', this).text(),
            published: new Date($('published', this).text())
        };
    }).get();
}​

ご覧のとおり、XML 要素をプロパティと.map.xml を持つオブジェクトの配列に変換するためにも使用しています。いくつかのプロパティ名 (場合によっては 、場合によっては ) を使用していたため、後で問題が発生していましたが、それも修正しました。titlepublishedeDatepublished

次の問題は、 を使用して日付を比較していたことですvalueOf。渡された日付にはbeforeShowDay時間の部分がないため、$.grep関数が日付を返す可能性はほとんどありませんtrue。私がこれを修正した方法は、関心のある日付の要素 (日付、月、通年) と比較することでした。

beforeShowDay: function(date) {
    var result = [true, '', null],
        matching = $.grep(events, function(event) {
            return event.published.getDate() === date.getDate() && 
                   event.published.getMonth() === date.getMonth() &&
                   event.published.getFullYear() === date.getFullYear();
        });

    if (matching.length) {
        result = [true, 'highlight', null];
    }
    return result;
},

にも同様の変更を加えましたonSelect：

onSelect: function(dateText) {
    var date, selectedDate = new Date(dateText),
        i = 0,
        event = null;

    while (i < events.length && !event) {
        date = events[i].published;

        if (selectedDate.getFullYear() === date.getFullYear() && 
            selectedDate.getMonth() === date.getMonth() && 
            selectedDate.getDate() === date.getDate()) {

                event = events[i];
        }
        i++;
    }
    if (event) {
        alert(event.title);
    }
}

ここに完全に機能する例があります: http://jsfiddle.net/4extL/31/

注：XMLで使用している日付形式には細心の注意を払っています。タイムゾーン付きの ISO8601 日付が常に適切に解析されるかどうかはわかりません。

于 2012-05-30T02:51:24.447 に答える
0

ありがとうアンドリュー。これは大きな助けになりました。私はこれをすべて次の編集で作業しています：

1... getSelectedDates() 関数では、XML ファイル全体を扱っているため、戻り値に「検索」を追加しました

return $(data).find('entry').map(function()

2...AJAX を使用して、XML ファイルからデータ変数を作成しました。

var data = $.ajax({
     url: "news.xml",
     type: "GET",
     dataType: "xml",
     async: false,
     success: function(xml){
           return xml;
     }
 } ).responseText;
于 2012-05-30T17:20:59.133 に答える