Question

我正在使用此页面中的代码http://jsfiddle.net/gnQUe/170/

如果我使用相同的脚本和放大器，如何在一个页面中使用多个这样的开关？ CSS

Answer 1

首先，将隐藏的输入放在与控件相同的div中，并为其设置class而不是id：

<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

您可以多次使用与“slider-frame”类相同的div

请查看JSFiddle此处

Jquery页面中的多个幻灯片复选框

2 个答案: