删除包含一组字符的类

有没有办法删除启动或包含定义的文本字符串的类？删除包含一组字符的类

我有几个班的背景颜色是会取代开始.bg

.bgwhite 
.bgblue 
.bgyellow

我已经设置了一个选择框，增加了一点点jQuery和删除修改类的元素，在这种情况下，<a href id="buttontostyle">标签我需要删除这些类与.bg开始，同时保持其他类这就决定了按钮的大小所以是这样的：

$("#buttoncolors").change(function() // buttoncolors is the select id 
    { 
     var valcolor = $("#buttoncolors").val(); 
     $("#buttontostyle").removeClass("bg" + "*"); 
     $("#buttontostyle").addClass(valcolor); 

    });

来源

2013-04-16 onebitrocket

使用REG EXP来确定开始模式的类名，并使用其删除删除（）从jquery – dreamweiver

重复http://stackoverflow.com/questions/57812/remove-all-classes-that-begin-with-a-certain-string – billyonecan

@billyonecan谢谢！ – onebitrocket

可以传递到removeClass一个函数返回一个列表你想要删除的类。在这个函数中，可以测试每个类名是否以bg开始，如果是，则将其添加到要删除的类的列表中。

$("#buttoncolors").on("change", function() { 
    var valcolor = $("#buttoncolors").val(); 

    $("#buttonstyle").removeClass(function (index, classNames) { 
    var current_classes = classNames.split(" "), // change the list into an array 
     classes_to_remove = []; // array of classes which are to be removed 

    $.each(current_classes, function (index, class_name) { 
     // if the classname begins with bg add it to the classes_to_remove array 
     if (/bg.*/.test(class_name)) { 
     classes_to_remove.push(class_name); 
     } 
    }); 
    // turn the array back into a string 
    return classes_to_remove.join(" "); 
    }); 

    $("#buttonstyle").addClass(valcolor); 
});

演示：http://codepen.io/iblamefish/pen/EhCaH

BONUS

您可以通过使用neaten了代码命名，而不是回调的匿名功能，使您可以使用它不止一次。

// name the function 
function removeColorClasses (index, classNames) { 
    var current_classes = classNames.split(" "), // change the list into an array 
     classes_to_remove = []; // array of classes which are to be removed 

    $.each(current_classes, function (index, class_name) { 
    // if the classname begins with bg add it to the classes_to_remove array 
    if (/bg.*/.test(class_name)) { 
     classes_to_remove.push(class_name); 
    } 
    }); 
    // turn the array back into a string 
    return classes_to_remove.join(" "); 
}

然后你可以一遍又一遍地通过传递其名称中使用此功能，你会通常会写function() { ... }

// code that the dropdown box uses 
$("#buttoncolors").on("change", function() { 
    var valcolor = $("#buttoncolors").val(); 

    $("#buttonstyle").removeClass(removeColorClasses); 

    $("#buttonstyle").addClass(valcolor); 
}); 

// another example: add a new button to remove all classes using the same function 
$("#buttonclear").on("click", function() { 
    $("#buttonstyle").removeClass(removeColorClasses); 
});

来源

2013-04-16 15:12:21 iblamefish

哇，非常感谢！ – onebitrocket

试试这个 -

$('#buttontostyle:not([class^="bg"])');

来源

2013-04-16 13:15:15

Downvoter - 你能解释一下为什么吗？ –

这不是我 - 但我猜这是因为你已经回答了两个选择没有特定类的东西，问题是如何从一个特定的字符串开始删除一组类。 – iblamefish

这应该做的伎俩，同时仍保持其他类：

var matches = $('#buttontostyle').attr('class').match(/\bbg\S+/g); 
$.each(matches, function(){ 
    var className = this; 
    $('#buttontostyle').removeClass(className.toString()); 
});

来源

2013-04-16 14:19:59 Terence

-2

试试这个

$("#buttontostyle").removeClass('[class^="bg"]');

来源

2013-04-16 14:23:32

删除包含一组字符的类

回答

相关问题