0

ループ内にいくつかの jQuery UI スライダーを作成したいと考えています。これは私のコードです:

JavaScript:

var teile = new Array();    
teile[0] = 100;
teile[1] = 200;
teile[2] = 300;

$(function() {
    for (var i = 0; i < 3; i++) {
        $('#slider' + [i]).slider({
            value: teile[i],
            min: 0, max: 600,
            slide: function(event, ui) {
                teile[i] = ui.value;
            }
        });
    }
});

HTML:

<div id="slider0"></div>
<div id="slider1"></div>
<div id="slider2"></div>

CSS:

#slider0{
    margin-top: 10px;
    margin-bottom: 10px;
    width: 600px;
}
#slider1{
    margin-top: 10px;
    margin-bottom: 10px;
    width: 600px;
}
#slider2{
    margin-top: 10px;
    margin-bottom: 10px;
    width: 600px;
}

これまでのところ機能していますが、スライダーを使用すると変数の値が更新されないようです。ループを使用しない場合、このように機能します。

4

2 に答える 2

3

これについてはよくわかりませんが、問題は範囲内にあると思います。

$(function() {
  for (var i=0; i<3; i++) {
    (function(index) {
      $('#slider'+[index]).slider({
        value: teile[index],
        min: 0, max: 600,
        slide: function(event, ui) {
          teile[index] = ui.value;
        }
      })
    })(i);
  }
});
于 2013-02-25T13:51:29.753 に答える
1

閉鎖が必要です：

for (var i = 0; i < 3; i++) {
    $('#slider' + [i]).slider({
        value: teile[i],
        min: 0,
        max: 600,
        slide: (function (index) {
            return function (event, ui) {
                teile[index] = ui.value;
            }
        })(i)
    })
}
于 2013-02-25T13:51:33.243 に答える