开发者问题收集

借助变量查找/使用 jquery 数组

2012-10-24
110

我完全不知道如何正确定义我的问题。

我为每个 .slider 都设置了一个函数,并且每个滑块都有一个带有“实际值”的变量。由于不同滑块的实际值数量不同,因此我想借助数组中的计数值来查找替代方案的数量,然后将 max: _ 设置为该数字。 使用 jQuery UI sliders

我的代码:

   var costValues = [0, 20, 50, 100, 200, 500, 1000, 2000, 5000, 10000, 50000];
        var timeValues = ['Upp till 10 min', 'Upp till: 30 minuter', 'Upp till: 1h', 'Upp till tre timmar', 'Upp till en halvdag', 'Upp till en heldag', 'Upp till 2-3 dagar', 'Upp till en vecka', 'Upp till en månad', 'Upp till ett halvår', 'Upp till Ett år', 'Över ett år'];
        $( ".slider" ).each(function(i, e) {

..more Code

“dennaArray”的内容与相关数组的名称相同,但我无法查找这些数组的 .length,因为它将“dennaArray”解释为具有“char 内容”的变量本身。

1个回答

Alisso,

从您问题的第一个版本开始...

首先,将数组设为普通 javascript 对象的属性:

var lookupArrays = {
    'cost': [0, 20, 50, 100, 200, 500, 1000, 2000, 5000, 10000, 50000],
    'time': ['Upp till 10 min', 'Upp till: 30 minuter', 'Upp till: 1h', 'Upp till tre timmar', 'Upp till en halvdag', 'Upp till en heldag', 'Upp till 2-3 dagar', 'Upp till en vecka', 'Upp till en månad', 'Upp till ett halvår', 'Upp till Ett år', 'Över ett år']
};

然后在 .each() 函数中,您可以从 lookupArrays 中选择两个数组之一:

var dennaArray = lookupArrays[$(e).parent().attr('id')];

我不确定,但 slide: 函数可能会简化为:

slide: function( event, ui ) {
    $(e).parent().find('.slider-result').html( dennaArray[ui.value] );
},

不要忘记使用 var 本地化变量。您的代码中有几个应该本地化但实际上没有。

编辑

以下是经过压缩和效率节省的代码:

$(function() {
    var $$ = {//cache of static jquery objects
        content: $('#content').hide(),
        rightColumn: $('#rightColumn').hide(),
        aktiviter: $('div.aktivitet'),
        tagSwitches: $('li.tag'),
        skickaFeedback: $('#skickaFeedback'),
        sliders: $('.slider'),
        describers: $('.describers'),
        header: $('#header'),
        h3: $('h3')
    };
    var lookupArrays = {
        'cost': [0, 20, 50, 100, 200, 500, 1000, 2000, 5000, 10000, 50000],
        'time': ['Upp till 10 minuter', 'Upp till: 30 minuter', 'Upp till: 1h', 'Upp till tre timmar', 'Upp till en halvdag', 'Upp till en heldag', 'Upp till 2-3 dagar', 'Upp till en vecka', 'Upp till en månad', 'Upp till ett halvår', 'Upp till Ett år', 'Över ett år'],
        'timeSimplified': ['tid-1', 'tid-2', 'tid-3', 'tid-4', 'tid-5', 'tid-6', 'tid-7', 'tid-8', 'tid-9', 'tid-10', 'tid-11', 'tid-12']
    };
    var dolj, visaContent;
    $$.sliders.each(function(i, e) {
        var $e = $(e),
            $parent = $e.parent();
        var dennaArray = lookupArrays[$parent.attr('id')];
        $e.slider({
            animate: true,
            range: "min",
            value: 0,
            min: 0,
            max: dennaArray.length-1,
            step: 1,
            start: function( event, ui ) {
                clearTimeout(dolj);
                clearTimeout(visaContent);
            },
            slide: function( event, ui ) {
                clearTimeout(dolj);
                clearTimeout(visaContent);
                switch($parent.attr('id')) {
                    case 'cost':
                        var txt = (ui.value == 0) ? 'Det måste vara gratis.' : 'Upp till: ' + dennaArray[ui.value] + ':-';
                    break;
                    case 'time':
                    default:
                        var txt = dennaArray[ui.value];
                }
                $parent.find('.slider-result').html( txt );
            },
            stop: function(event, ui) {
                dolj = setTimeout(function () {
                    $$.sliders.add($$.describers).add($$.header.find('h2')).slideUp();
                    $$.h3.css('cursor', 'pointer');
                    $parent.next().children().andSelf().slideDown();
                    $$.header.find('h1').animate({
                        'font-size': '1.4em',
                    }, 1000, function() {
                    });
                }, 3500);
                visaContent = setTimeout(function() {
                    $$.content.add($$.rightColumn).slideDown();
                }, 400);
            }
        });
    });
    //Om du klickar på ngn av frågorna så visas slidern igen så att du kan ändra dina parametrar :D
    $('.question').click(function(){
        $(this).show().parent().children().toggle();
    });
    $$.rightColumn.on('click', 'li.tag', function(){
        $$.aktiviter.hide();
        $tagSwitch = $(this).toggleClass('active');
        $$.tagSwitches.each(function() {
            if($(this).hasClass('active')) {
                var filterID = $(this).attr('id').replace("filterid-",'');
                $$.aktiviter.filter("." + filterID).show();
            }
        });
    });
    $('#skickaFeedback').click(function(){
        $.ajax({
            type: "POST",
            url: "saveFeedback.php",
            data: "someFeedback=" + $(this).prev().val(),
            cache: false,
            success: function(html){
                alert('Tack för din feedback!');
                $('#skickaFeedback').prev().val('');
            }
        });
    });
});
Beetroot-Beetroot
2012-10-25