Using multiple colors for highlighting

问题

I have this example code to highlight specific cells of a table. Is there a way to switch colors or use multiple colors at the same time?

I need to achieve two things here. 1) I'd like to be able to set the color of the parameter groups (or parameters individually) to a certain color on the front-end before I click them. Up to 5 colors would be enough. 2)It is not important with parameter goes which color. Colors can be assigned randomly. I reedited this question to make it clearer.

Here is the fiddle page for the project: http://jsfiddle.net/max33/kjcyu3yb/

$('.selector').each(function() {
    $(this).on('click', check); 
});
    $('.all').each(function() {
       $(this).on('click', all); 
    });

function all(event) {
    
        if($(this).is(':checked')){  $("input:checkbox:not(:checked)",$(this).parents('form')).not(this).prop("checked","checked");
    } else {
        $("input:checkbox(:checked)",$(this).parents('form')).not(this).prop("checked","");
    }
    
    //$('.selector').prop("checked", this.name === "SelectAll");
    
    check(event);
}

function check(event) {
    var checked = $(".selector:checked").map(function () {
        return this.name
    }).get()
    $('td').removeClass("highlight").filter(function () {
        return $.inArray($(this).text(), checked) >= 0
    }).addClass("highlight")
    if ($(this).is(".selector"))
        $('.all').not(this).prop("checked", false)

}



 

 

回答1:

You can use different classes for each form element. Like I have used highlight-x for x. Then after adding general highlight class to all selected elements, I am adding extra class for X. You can remove all classes at once using removeClass with no parameters. It will remove all of the item's classes. Check this fiddle. Select all from first form. You will see all X are highlighted using red. If this doesn't go with your requirement then let me know.

来源：https://stackoverflow.com/questions/30560009/using-multiple-colors-for-highlighting