如何在关联数组中获取键和值

Question

我有一个日期选择器，它仅基于 3 组数组启用了一些日期。 onSelect 我检索我点击的可用日期。 现在事情变得复杂了。具有可用日期的数组需要是一个关联数组，其中 id 和日期分别为“键”和“值”。如何检索与我点击的可用日期关联的 id？

到目前为止，这是我的代码：

function calendar(){

    function datePicker(array){
        $j("#datepicker").datepicker({
            dateFormat: 'dd-mm-yy',
            minDate: $j.datepicker.parseDate('ddmmyy', array[0]), //this makes the datepicker start at the first available
            beforeShowDay: function(dateToShow){
                if ($j.inArray($j.datepicker.formatDate('ddmmyy', dateToShow),array) !== -1) return [1, 'my-class', 'Available date!'];
                else return [0, 'no-class', 'Date not available!'];

            },
            //get the selected date
            onSelect: function(dateText) {
                var dateAsString = dateText; //the first parameter of this function

                //var dateAsObject = $j(this).datepicker( 'getDate' ); //the getDate method
                $j('#getDate').text(dateAsString);
            }
        });
    }


    $j('.book-pack a.button').each(function(){

        //getting the button id
        var btnId = $j(this).attr('id');

        //arrays with available dates for the 3 packs
        var datesClub = new Array('08102010', '09102010', '15102010', '16102010', '22102010', '23102010', '29102010', '30102010');
        var datesEssential = new Array('08102010', '09102010', '15102010', '16102010', '22102010', '23102010', '29102010', '30102010');
        var datesFling = new Array('08102010', '09102010', '15102010', '16102010', '22102010', '23102010', '29102010', '30102010');


        $j(this).click(function(){

            switch(btnId)
            {
                case 'club-class':
                    $j('.window h2.page-title').text('Club Class');
                    datePicker(datesClub);
                    break;
                case 'essential':
                    $j('.window h2.page-title').text('The Essential Experience');
                    datePicker(datesEssential);
                    break;
                case 'last-fling':
                    $j('.window h2.page-title').text('Last Fling Before the Ring');
                    datePicker(datesFling);
                    break;
            }

            return false;
        });
    });
}

Answer 1

尝试这样的事情 (demo)：

此脚本从关联数组（对象）创建日期数组。切换键：值对更容易，因此日期是键，值是 id，但我认为它可以理解这个想法。

function calendar() {

    function datePicker(pack) {
        // create array of dates from pack
        var i, array = [];
        for (var i in pack) {
            array.push(i);
        }
        $j("#datepicker").datepicker({
            dateFormat: 'dd-mm-yy',
            minDate: $j.datepicker.parseDate('ddmmyy', array[0]),
            //this makes the datepicker start at the first available
            beforeShowDay: function(dateToShow) {
                return ($j.inArray($j.datepicker.formatDate('ddmmyy', dateToShow), array) !== -1) ? [1, 'my-class', 'Available date!'] : [0, 'no-class', 'Date not available!'];
            },
            //get the selected date
            onSelect: function(dateText, inst) {
                var dateAsString = dateText,
                    //the first parameter of this function
                    dateCompressed = (dateText).replace(/-/g, ''); // dd-mm-yyyy -> ddmmyyyy
                $j('#getDate').text(dateAsString);
                $j('#getId').text(pack[dateCompressed]);
            }

        });
    }


    $j('.book-pack a.button').each(function() {
        //getting the button id
        var btnId = $j(this).attr('id');
        //arrays with available dates for the 3 packs
        var datesClub = { '08102010' : 'id1', '09102010' : 'id2', '15102010' : 'id3', '16102010' : 'id4', '22102010' : 'id5', '23102010' : 'id6', '29102010' : 'id7', '30102010' : 'id8' };
        var datesEssential =  { '08102010' : 'id1', '09102010' : 'id2', '15102010' : 'id3', '16102010' : 'id4', '22102010' : 'id5', '23102010' : 'id6', '29102010' : 'id7', '30102010' : 'id8' };
        var datesFling =  { '08102010' : 'id1', '09102010' : 'id2', '15102010' : 'id3', '16102010' : 'id4', '22102010' : 'id5', '23102010' : 'id6', '29102010' : 'id7', '30102010' : 'id8' };

        $j(this).click(function() {
            switch (btnId) {
            case 'club-class':
                $j('.window h2.page-title').text('Club Class');
                datePicker(datesClub);
                break;
            case 'essential':
                $j('.window h2.page-title').text('The Essential Experience');
                datePicker(datesEssential);
                break;
            case 'last-fling':
                $j('.window h2.page-title').text('Last Fling Before the Ring');
                datePicker(datesFling);
                break;
            }
            return false;
        });
    });
}