假设我有一个像这样的jQuery UI Slider:
$(".mySlider").slider({
range: "min",
min: 0,
max: 10,
slide: function(event, ui){
// do stuff here on slide...
}
});
假设我的滑块旁边有一个动态输入文本来显示滑块的值,如下所示:
<input id="slider-value" type="text" value="7" style="text-align: center;">
所以我的滑块的完整代码是:
<p>
<div id="slider-value" class="mySlider ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<input id="slider-value" type="text" value="7" style="text-align: center;">
</p>
如您所见,最初,当页面加载时,我的滑块的值为 7。此外,显示滑块值的输入文本与滑块 div 本身具有相同的 id。我希望滑块的句柄在页面加载时显示该值。如果我将滑块的 value 属性设置为 7,如下所示:
$(".mySlider").slider({
range: "min",
min: 0,
max: 10,
value: 7, // value of the slider handle
slide: function(event, ui){
// do stuff here on slide...
}
});
这可以正常工作,但显然,这不是最好的方法,因为滑块的值是从数据库中检索的并且可能会更改(可能是 1、8、4、6 等...)。
现在,如果我尝试做类似的事情:
$(".mySlider").slider({
range: "min",
min: 0,
max: 10,
value: $(this).closest("p").find("input[id=" + $(this).attr("id") + "]").attr("value"), // setting the value of the slider handle dynamically
slide: function(event, ui){
// do stuff here on slide...
}
});
出于某种原因,这不起作用。句柄不显示值。我做错了什么?,是因为我不能在 $().slider({}) 中使用 $(this) 吗?
请让我知道为什么这不起作用
谢谢