複数のアップロードを可能にする簡単なアップロードフォームがあり、選択したファイルごとに新しいスライダーを作成する必要があります。
新しいスライダーを作成しました。それぞれに個別のIDがあります。私が抱えている唯一の問題は、スライダーがスライドしたり変更されたりするたびに、スライダーにその値をテキストボックスに入力させたいということです。動的に追加されない通常のスライダーでは正常に機能しますが、動的に追加されたスライダーは個々のテキストボックスを更新しません。
スライダーとテキストボックスを追加するコードは次のとおりです。
var pagesslider = $('<div id="pages'+(x + 1)+'" class="pages"></div><input name="anewslider" id="pages-box'+(x + 1)+'" type="text" onchange="$(\'#pages'+(x + 1)+'\').slider({ value: this.value });updatevalues();updatepages(\''+x+'\');" value="1" />');
$('#pages-holder').append(pagesslider);
addSlider('pages'+(x + 1));
addSlider関数は次のとおりです。
function addSlider(element) {
var slider = $('.pages').slider({
range: "min",
value: 1,
min: 1,
max: 1000,
slide: function(event, ui) {
slide(element, ui.value);
},
change: function(event, ui) {
slide(element, ui.value);
}
});
$(element).val(slider.slider('value'));
}
スライド機能は、テキストボックスの値を変更するだけです。
$(element).attr('value', changevalue);
テキストボックスに手動で数値を入力すると、スライダーの位置が更新されます。これにより、正常に機能します。しかし、それは逆には機能しません。ページを読み込んだときにスライダーが読み込まれなかったためだと思いますが、修正方法がわかりません。