여러 jquery 슬라이더 인스턴스

Question

하나의 페이지에 3 개의 jquery 슬라이더가있어 여러 그룹 (남성/여성/어린이)의 구두 크기를 보여줍니다. 각 그룹에는 UK/US/Euro에 대한 값 배열이 있습니다. 첫 번째 인스턴스 만 업데이트해도 US/EURO의 크기는 다시 가져 오지 않지만 실행하면됩니다. 내가 뭘 놓치고 있니? 문제는

http://www.petersenuploads.co.uk/footslider.html

감사

Answer 1

대신 배열을 정의 할 때 사용 등호의 - (마이너스) 표시가있다 :

sizesWomens[0] - new Array(3,4.5,35.5); 

이어야

sizesWomens[0] = new Array(3,4.5,35.5); 

그러나 나는 그것이 더 좋을 것이라고 생각한다. 그들이 다시 2로 이동하기 때문에, 특히 아이들의 크기에, 당신이 가진 것보다 다른 방법을 사용하는 것이 ... 그에 대한 수정 작업을하기 위해 나에게 분 제공)

---

업데이트 : (이 코드를 사용해보십시오 배열을 설정하는 것이 훨씬 더 빨라질 수 있습니다.) - 여기 demo!

$(document).ready(function() { 
    var updateSizes = function (s) { 
     return "UK size:" + s[0] + ", US size: " + s[1] + ", Euro size: " + s[2]; 
    }, 
    menSizes = Array(14), 
    womenSizes = Array(10), 
    childrenSizes = Array(18); 

    menSizes[0] = [5, 6, 38]; 
    menSizes[1] = [5.5, 6.5, 38.5]; 
    menSizes[2] = [6, 7, 39]; 
    menSizes[3] = [6.5, 7.5, 40]; 
    menSizes[4] = [7, 8, 40.5]; 
    menSizes[5] = [8, 9, 42]; 
    menSizes[6] = [8.5, 9.5, 42.5]; 
    menSizes[7] = [9, 10, 43]; 
    menSizes[8] = [9.5, 10.5, 44]; 
    menSizes[9] = [10, 11, 44.5]; 
    menSizes[10] = [10.5, 11.5, 45]; 
    menSizes[11] = [11, 12, 46]; 
    menSizes[12] = [11.5, 12.5, 46.5]; 
    menSizes[13] = [12, 13, 47]; 

    womenSizes[0] = [3, 4.5, 35.5]; 
    womenSizes[1] = [3.5, 5, 36]; 
    womenSizes[2] = [4, 5.5, 37]; 
    womenSizes[3] = [5, 6.5, 38]; 
    womenSizes[4] = [5.5, 7, 38.5]; 
    womenSizes[5] = [6, 7.5, 39]; 
    womenSizes[6] = [6.5, 8, 39.5]; 
    womenSizes[7] = [7, 8.5, 40]; 
    womenSizes[8] = [7.5, 9, 41]; 
    womenSizes[9] = [8, 9.5, 42]; 

    childrenSizes[0] = [0, 0, 15]; 
    childrenSizes[1] = [0.5, 1, 16]; 
    childrenSizes[2] = [1.5, 2, 17.5]; 
    childrenSizes[3] = [2.5, 3, 19]; 
    childrenSizes[4] = [3.5, 4, 20]; 
    childrenSizes[5] = [4.5, 5, 21]; 
    childrenSizes[6] = [5.5, 6, 22.5]; 
    childrenSizes[7] = [6.5, 7, 23.5]; 
    childrenSizes[8] = [7.5, 8, 25]; 
    childrenSizes[9] = [8, 9, 27]; 
    childrenSizes[10] = [9, 10, 28]; 
    childrenSizes[11] = [10, 11, 29]; 
    childrenSizes[12] = [11, 12, 30]; 
    childrenSizes[13] = [12, 13, 31]; 
    childrenSizes[14] = [13.5, 1, 32.5]; 
    childrenSizes[15] = [2, 2, 34]; 
    childrenSizes[16] = [2.5, 3, 35]; 
    childrenSizes[17] = [3.5, 4, 36]; 

    $("#slider-men").slider({ 
     range: "max", 
     min: 0, 
     max: 13, 
     step: 1, 
     slide: function (e, ui) { 
      $("#amount-men").val(updateSizes(menSizes[ui.value])); 
     } 
    }); 
    $("#amount-men").val(updateSizes(menSizes[0])); 
    $("#slider-women").slider({ 
     range: "max", 
     min: 0, 
     max: 9, 
     step: 1, 
     slide: function (e, ui) { 
      $("#amount-women").val(updateSizes(womenSizes[ui.value])); 
     } 
    }); 
    $("#amount-women").val(updateSizes(womenSizes[0])); 
    $("#slider-children").slider({ 
     range: "max", 
     min: 0, 
     max: 17, 
     step: 1, 
     slide: function (e, ui) { 
      $("#amount-children").val(updateSizes(childrenSizes[ui.value])); 
     } 
    }); 
    $("#amount-children").val(updateSizes(childrenSizes[0])); 
});