好的,这是对我要做的事情的澄清。我有一张桌子,我试图按动物类型排序。我有这一切都工作,但由于某种原因,行上的条纹搞砸了。我可以在彼此的顶部有2条灰色条纹行。 Jfiddle
$(document).ready(function(){
// Get all the rows for the table
$upcoming = $('#upcoming_production_sales .table');
$events = $upcoming.find('tr.event');
map = {};
// Find the event category column push into map
$events.each(function(idx,ele){
diffText = $(ele).find('td.event-category').text();
diffText = (diffText == undefined || diffText == "" ? "Other" : diffText).toLowerCase();
if(!map[diffText]){
map[diffText]=[];
}
map[diffText].push(ele);
});
// Get keys
keys=Object.keys(map);
var filterEvents = function filterEvents(diffText) {
keys.forEach(function(key, idx, arr) {
var hideRows = (key.toLowerCase() != diffText.toLowerCase()) && ("all" != diffText.toLowerCase());
map[key].forEach(function(row, idx, arr) {
if(hideRows) $(row).hide();
else $(row).show();
});
});
};
$("#upcoming_production_sales .all-upcoming-events").click(function(event){
// Remove active class
$("#upcoming_production_sales .nav li").removeClass('active');
// Add active class to clicked event
$(this).parent().addClass('active');
filterEvents('all');
event.preventDefault();
});
$("#upcoming_production_sales .cattle-upcoming-events").click(function(event){
$("#upcoming_production_sales .nav li").removeClass('active');
$(this).parent().addClass('active');
filterEvents('cattle');
event.preventDefault();
});
$("#upcoming_production_sales .deer-upcoming-events").click(function(event){
$("#upcoming_production_sales .nav li").removeClass('active');
// Add active class to clicked event
$(this).parent().addClass('active');
filterEvents('deer');
event.preventDefault();
});
$("#upcoming_production_sales .equine-upcoming-events").click(function(event){
$("#upcoming_production_sales .nav li").removeClass('active');
$(this).parent().addClass('active');
filterEvents('equine');
event.preventDefault();
});
$("#upcoming_production_sales .goat-upcoming-events").click(function(event){
$("#upcoming_production_sales .nav li").removeClass('active');
$(this).parent().addClass('active');
filterEvents('goats');
event.preventDefault();
});
$("#upcoming_production_sales .sheep-upcoming-events").click(function(event){
$("#upcoming_production_sales .nav li").removeClass('active');
$(this).parent().addClass('active');
filterEvents('sheep');
event.preventDefault();
});
$("#upcoming_production_sales .swine-upcoming-events").click(function(event){
$("#upcoming_production_sales .nav li").removeClass('active');
$(this).parent().addClass('active');
filterEvents('swine');
event.preventDefault();
});
$("#upcoming_production_sales .other-upcoming-events").click(function(event){
$("#upcoming_production_sales .nav li").removeClass('active');
$(this).parent().addClass('active');
filterEvents('other');
event.preventDefault();
});
});