Question

当我移动第一个滑块并按下第二个按钮时，它显示第一个滑块的值，反之亦然，但我只想要第二个滑块的值

HTML

<h1>HTML Slider Test</h1>
<div class="slider"></div>
<p>Your slider has a value of <span class="slider-value"></span></p>
<input type="button" class="ab" value="send">
<div class="slider"></div>
<p>Your slider has a value of <span class="slider-value"></span></p>
<input type="button" class="ab" value="send">

jquery的

$(".slider").slider(
{
        value:1,
        min: 0,
        max: 100,
        step: 1,
        slide: function( event, ui ) {
            a=ui.value;
            $(ui.handle).closest(".slider").next( "p").find(".slider-value").html( ui.value );
        }
}
);

$( ".slider-value").html(  $('.slider').slider('value') );

$(".ab").click(function(){
alert(a);
});

http://jsfiddle.net/5TTm4/1937/

Answer 1

点击按钮

从第二个滑块获取值

<强> HTML

 <h1>HTML Slider Test</h1>
<div>
<div class="slider"></div>

<p>Your slider has a value of <span class="slider-value"></span></p>
<input type="button" class="ab" value="send" />
 </div>


<div>
<div class="slider"></div>
<p>Your slider has a value of <span class="slider-value"></span></p>
<input type="button" class="ab" value="send" />
 </div>

<强> Jquery的

 $(".ab").click(function(){
  a=  $(this).closest('div').find('.slider').slider("option", "value");
  alert(a);
 });

<强> Demo

Answer 2

你必须在diff滑块上有diff处理。我用diff Ids

制作了它

检查我的小提琴

http://jsfiddle.net/khaleel/hxe0wg6w/1/

希望有所帮助

Answer 3

这是满足您需求的一种方式。请检查这个小提琴，看看JS代码，所以我不用垃圾邮件代码垃圾邮件。

<h1>HTML Slider Test</h1>

<div id="sliderone" class="slider"></div>

<p>Your slider has a value of <span class="slider-value"></span></p>
<input id="buttonone" type="button" class="ab" value="send">

<div id="slidertwo" class="slider"></div>
<p>Your slider has a value of <span class="slider-value"></span></p>
<input id="buttontwo" type="button" class="ab" value="send">

http://jsfiddle.net/25ccz9g3/

使用ui.value警告jquery滑块问题

3 个答案: