0

首先，我是 jquery 初学者，所以请不要因为我缺乏知识而生气。

我正在尝试构建一个 jquery 滑块，它的开关正好是其宽度的一半，并且两个输入带有来自滑块的值，它们以特定方式工作：

如果将滑块的开关移到左侧，输入中的值#first会减少，输入中的值#second会增加。对于右侧，情况相反。所以如果我将滑块向右移动并且#second框获得（例如）值 30，则#first获得值 70。

我希望你能理解我的需要。。

到目前为止，我已经设法在滑块中间切换，#first输入从滑块中获取值

我不知道如何从这里继续前进

您可以在这里查看和编辑情况：http: //jsfiddle.net/M8AWg/

html:

<div class="container">
    <input type="text" id="first"/>
    <input type="text" id="second"/>
    <div id="slider"></div>
</div>

js：

$('#first, #second').val('50');

$(function() {
    $( "#slider" ).slider(
    { value: 50,
        slide: function( event, ui ) {
            $( "#first" ).val( ui.value );
            $(ui.value).val($('#first').val());
            }     
        }
    );
  });
4

2 回答 2

2

总数总是100吗？如果是这样，您可以添加以下行：

$( "#second" ).val( 100 - ui.value );

看这里：

http://jsfiddle.net/M8AWg/1/

于 2013-07-08T12:46:17.777 回答
1

使用滑块中的值和负 100 得到余数。也会$(ui.value)寻找$(30)不存在的

$(function() {
    $( "#slider" ).slider(
    { value: 50,
        slide: function( event, ui ) {
            $( "#first" ).val( ui.value );
            $('#second').val(100-ui.value);
            }     
        }
    );
  });

小提琴

于 2013-07-08T12:46:49.030 回答