Jquery使用滑块添加和删除类

Question

我有下面的滑块代码，现在我需要使用max和min值为元素添加和删除css。

这就是我所拥有的：

   $( "#audioslider" ).slider({
        orientation: "vertical",
        range: "min",
        min: 0,
        max: 100,
        value: 60,
        slide: function( event, ui ) {
            var value = $("#audioslider").slider("value");
            document.getElementById("audio").volume = (value / 100);
            if(value == 0){
            $('.volumeon').addClass('volumeoff')
            }else if(value >= "max"){
            $('.volumeon').addClass('volumeon')
            }
        }
    });

如果它是最小值，它将添加类，但如果它大于最小值，则不添加。那么我该怎么做呢？

Answer 1

它看起来主要像是一个拼写错误——您将value与文本"max"进行比较，而不是将其与变量进行比较。把那条线改成

}else if (value == 100){

Answer 2

看起来逻辑有点偏离。

如果值>=100，则"体积"处于启用状态，但如果值为0，则"音量"处于禁用状态？如果音量大于0，它不会打开吗？

正如Andy提到的，您将var值与字符串"max"进行比较，而不是将实际的最大值（滑块的属性）进行比较。

在给定逻辑的任何情况下。当值等于0时，您将希望对"volumeOn"执行remove类并添加"volumeOff"类。如果值>=100，则需要执行相反的操作，删除"volumeOff"并添加"volumeOn"。

本质上就是这段代码。

if(value == 0){
  $('.volumeon').addClass('volumeoff').removeClass('volumeon');
} else if(value >= 100){
  $('.volumeoff').addClass('volumeon').removeClass('volumeoff');
}

Answer 3

你是这样说的吗？

if(value < 1){
    $('.volumeon').addClass('volumeoff');
    $('.volumeon').removeClass('volumeon');
 }else {
    $('.volumeoff').addClass('volumeon');
    $('.volumeoff').removeClass('volumeoff');
 }