jQueryの複数のスライド]チェックボックス

Question

私は、このページからコードhttp://jsfiddle.net/gnQUe/170/

jquery slide toggle as a form checkbox

私は同じスクリプトを使用している場合はどのように私は、単一のページで複数のこのようなスイッチを使用することができますを使用してい& CSS

Answer 1

まず、コントロールと同じdivに隠し入力を入れて、それを代わりにidのclassを与える：

<div class="slider-frame"> 
    <span class="slider-button">NO</span> 
    <input type="hidden" class="slider-value" value="false"> 
</div> 

そして、それは価値です変更するには、このjQueryのを使用します。

$('.slider-button').toggle(function() { 
    $(this).addClass('on').html('YES'); 
    $(this).next(".slider-value").val(true); 
}, function() { 
    $(this).removeClass('on').html('NO'); 
    $(this).next(".slider-value").val(false); 
}); 

Example fiddle

あなたは価値の変化を見ることができるので、私はtextとして入力を残してきたフィドルに表示されます。

Answer 2

あなたが「スライダーフレーム」クラスと同じdiv要素を使用することができ、何度

確認してくださいここでJSFiddle