我要做的是拥有一个可以处理多个滑块的通用JavaScript。我正在添加一个span标记，它将滑块的值保存到每个滑块。然后我想在change事件上更改span标记的值。
我的问题是让它通用，所以它只会改变正确的span标签。我已尝试使用event.target.siblings().attr(title)或包含该值的任何其他属性，例如aria-valuenow等。但它们都没有显示span标记中的值。
的javascript：
$('.slider_cont a').append('<span class="tt">'+$('.slider_cont a').attr('title')+'</span>');
$('.slider_cont').live("change",function(event){
$('.tt').html(event.target.siblings().attr('aria-valuenow'));
});
HTML：
<div id="ch1" class="slider_cont">
<label for="slider-1" class="intensity_label">Intensity</label>
<input type="range" name="slider-1" id="slider-1" data-mini="true" data-highlight="true" data-track-theme="d" data-theme="b" step="1" min="0" max="255" value="50">
</div>
<div id="ch2" class="slider_cont">
<label for="slider-2" class="intensity_label">Lights On</label>
<input type="range" name="slider-2" id="slider-2" data-mini="true" data-track-theme="d" data-theme="b" min="0" max="1440" value="15">
</div>
来自firebug的输出：
<div id="ch1_intensity" class="slider_cont">
<label id="slider-1-label" class="intensity_label ui-input-text ui-slider" for="slider-1">Intensity</label>
<input id="slider-1" class="ui-input-text ui-body-b ui-corner-all ui-shadow-inset ui-mini ui-slider-input" type="number" data-type="range" value="50" max="255" min="0" step="1" data-theme="b" data-track-theme="d" data-highlight="true" data-mini="true" name="slider-1">
<div class="ui-slider ui-btn-down-d ui-btn-corner-all ui-slider-mini" role="application">
<div class="ui-slider-bg ui-btn-active ui-btn-corner-all" style="width: 32.9412%;"></div>
<a class="ui-slider-handle ui-btn ui-shadow ui-btn-corner-all ui-btn-up-b" href="#" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="b" role="slider" aria-valuemin="0" aria-valuemax="255" aria-valuenow="84" aria-valuetext="84" title="84" aria-labelledby="slider-1-label" style="left: 32.9412%;">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="tt-intensity">50</span>
</a>
</div>
</div>
<div id="ch1_lights_on" class="slider_cont">
<label id="slider-2-label" class="intensity_label ui-input-text ui-slider" for="slider-2">Lights On</label>
<input id="slider-2" class="ui-input-text ui-body-b ui-corner-all ui-shadow-inset ui-mini ui-slider-input" type="number" data-type="range" value="15" max="1440" min="0" data-theme="b" data-track-theme="d" data-highlight="true" data-mini="true" name="slider-2">
<div class="ui-slider ui-btn-down-d ui-btn-corner-all ui-slider-mini" role="application">
<div class="ui-slider-bg ui-btn-active ui-btn-corner-all" style="width: 1.04167%;"></div>
<a class="ui-slider-handle ui-btn ui-btn-up-b ui-shadow ui-btn-corner-all" href="#" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="b" role="slider" aria-valuemin="0" aria-valuemax="1440" aria-valuenow="15" aria-valuetext="15" title="15" aria-labelledby="slider-2-label" style="left: 1.04167%;">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="tt-intensity">50</span>
</a>
</div>
</div>