Question

我有一个简单的上传表单，允许多次上传，对于每个选中的文件，它需要创建一个新的滑块。

我已经创建了一个新的滑块，它们每个都有个人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);

当您在文本框中手动键入数字时，滑块的位置会更新 - 这样就可以正常工作。但它反过来不起作用。我猜这是因为当页面加载时滑块没有加载，但我不知道它的修复。

Answer 1

动态添加任何新jquery滑块的最简单方法是：

var fieldvalue = '<input type="range" name="loan_term" class="textbox" id="my_new_slider" min="12" max="36" step="12" value="24" />';

$('#divelement').html(fieldvalue);

$("#my_new_slider").rangeinput({
     progress: true
});

我希望它有助于其他人

Answer 2

所以大家..如果你的ID正确的话会证明它有用。

动态添加jQuery滑块

2 个答案: