0

我正在使用 switchify() 作为我的拨动开关。我的 html 中有几个选择：

<select id="first">
<option value="on"> On </option>
<option value="off"> Off </option>
</select>

<select id="second">
<option value="on"> On </option>
<option value="off"> Off </option>
</select>

<select id="third">
<option value="on"> On </option>
<option value="off"> Off </option>
</select>

我想在切换开关时做点什么。所以这里是 Jquery 代码：

$('select').switchify().data('switch').bind('switch:slide', function(e,type){
// do something
});

但该代码仅适用于第一个选择。如果我分别用 id 替换它，它工作正常：

$('#first').switchify().data('switch').bind('switch:slide', function(e,type){
// do something
});

$('#second').switchify().data('switch').bind('switch:slide', function(e,type){
// do something
});

$('#third').switchify().data('switch').bind('switch:slide', function(e,type){
// do something
});

有谁知道第一个版本的问题是什么（注意：标签名称选择器或类选择器都具有相同的效果）？这是因为 switchify() 中的一些问题吗？还是我错过了什么？在过去的几个小时里，它让我发疯了！：/

我在 jsfiddle 中做了这个例子来说明这个问题：http: //jsfiddle.net/yTRJh/ 你可以看到只记录了第一个开关切换！

4

1 回答 1

1

你需要使用

$('select').switchify().each(function() {
    $(this).data('switch').bind('switch:slide', function(e, type) {
        $('ul').append('<li>Switching ' + type);
    });
});

演示：小提琴

这是因为.data('switch')返回data第一个选择的元素。

返回 jQuery 集合中第一个元素的命名数据存储中的值，由 data(name, value) 或 HTML5 data-* 属性设置。

于 2013-07-30T05:23:27.617 回答