Question

我正在尝试构建自己的360'jQuery自动库。我可以添加类，但是，如果我使用滑块返回box1，它不会添加新类。谢谢你的帮助。

这是投给jsfiddle的项目：

var interval;
    interval = setInterval(function () {
        var chosenvalue = $(".amount1").val()
        var chosenclass = "box" + chosenvalue
        $(".box1").addClass(chosenclass,1000);
}, 100);

Answer 1

删除addClass()方法中 selectedclass 一词的引号：

var interval;
    interval = setInterval(function () {
        var chosenvalue = $(".amount1").val()
        var chosenclass = "box" + chosenvalue
        $(".box1").addClass(chosenclass);
}, 100);

fiddle

Answer 2

您需要使用chosenclass代替'chosenclass'，您无需传递secound参数。

$(".box1").addClass(chosenclass);

如果要删除所有类，请使用.removeClass()，否则传递className以删除

查看addClass和removeClass

的文档

Demo

Answer 3

您尝试编写的代码中存在多个问题。

使用removeClass和addClass的方法。
您不需要间隔来监控价值变化。您可以使用滑块的更改事件。
您需要删除之前添加的类，以便向后移动。

我已经重写了代码以满足您的要求。请注意，jquery没有通过通配符删除类的方法。所以在removeClass中使用函数作为参数，它使用reg ex magic来完成这些工作。

$(function() {
    $( "#slider1" ).slider({
        range: "min",
        value: 1,
        min: 1,
        max: 9,
        slide: function( event, ui ) {
            $( ".amount1" ).val( ui.value);

            var chosenvalue = $(".amount1").val()
            var chosenclass = "box" + chosenvalue

            $(".mycar").removeClass (function (index, css) {
                return (css.match (/box\d+/g) || []).join(' ');
            });
            $(".mycar").addClass(chosenclass);
        }
    });
    $( ".amount1" ).val($( "#slider1" ).slider( "value" ));
});

在这里找到更新的小提琴。

http://jsfiddle.net/Z8knE/37/

无法将var中的类名放入addClass命令中

3 个答案: