【发布时间】:2011-09-05 14:40:01
【问题描述】:
我创建了一个滑动条来确定用户想要下载的最大字节数。此滑块连接到一个选择框。随着滑块沿线移动,它会更新选择框中的值。但是,当您从选择框中选择一个值时,它不会更新滑块的值。我如何让它双向更新??
JavaScript
$(function() {
var select = $( "#camlogbytes");
var slider = $( " <div id='slider'></div>").insertAfter(select).slider({
min: 1,
max: 6,
step: 1,
value: select[0].selectedIndex + 1,
slide: function(event, ui) {
select[0].selectedIndex = ui.value - 1;
}
});
$("camlogbytes").change(function() {
slider.slider("value", this.selectedIndex + 1);
});
});
HTML
<tr>
<td class="column1">Max number of bytes per Camera Log:</td>
<td id="sliderbytes">
<select name="camlogbytes" id="camlogbytes">
<option value="0"selected="selected">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</td>
</tr>
【问题讨论】:
标签: javascript jquery html uislider