Как выбрать только несколько классов элемента - PullRequest
Новая
       17

Как выбрать только несколько классов элемента

0 голосов
/ 05 января 2012

У меня есть ячейка заголовка таблицы, которая имеет как форматирование, так и функциональные классы, например: 

 <th class="persistent optional some-other-classes">

Я хочу скопировать persistent и необязательно ввсе последующие ячейки таблицы, но мне сложно выбрать подходящие классы

Я пытаюсь это сделать, но это никуда меня не ведет ... 

 $('th, TH').filter( '.persistent, .optional')

Есть ли способзахватить только эти два класса без ссылки some-other-class по имени?

Спасибо за помощь!

РЕДАКТИРОВАТЬ: больше информации
У предметов будет более 3 классов.Я только хочу скопировать / вставить постоянные и необязательные классы, которые обрабатывают внешний вид таблицы, и оставить классы форматирования

Это должно быть что-то вроде: 

 $('th, TH').attr(class).filter( '.persistent, .optional' )

, который не работаетКонечно.

Ответы [ 6 ]

1 голос
/ 05 января 2012

Следующие элементы будут соответствовать th элементам любого из классов: 

$('th.persistent, th.optional');

или для соответствия th элементов, которые имеют оба: 

$('th.persistent.optional');

Или, чтобы получить элементы, которые имеют класс только постоянных или только необязательно или только оба: 

$('th.persistent, th.optional').filter(function() {
  var classes = this.className.split(/\s+/);
  return classes.length == 1 || (classes.length == 2 && $(this).is('.persistent.optional');
};

Обновление

Хорошо, я думаю, что теперь понимаю ваше требование - если заголовок таблицы равен .optional, то все td элементы в столбце также должны иметь класс .optional, аналогично для .persistent: 

$('th.persistent, th.optional').each(function() {
  var th = $(this);
  var col = th.parent().children().index(th);
  th.closest('table').find('td').each(function() {
    var td = $(this);
    if (td.parent().children().index(td) === col) {
      if (th.is('.persistent')) td.addClass('persistent');
      if (th.is('.optional')) td.addClass('optional');
    }
  });
});
0 голосов
/ 05 января 2012

После долгих вмешательств, это мое решение, которое работает: 

    var classes = "",

    allClasses = th.attr("class").split(/\s+/);

    for (var j = 0; j < allClasses.length; j++) {
          if (allClasses[j] === 'persistent' || allClasses[j] === 'optional' ) {
             classes = classes+" "+allClasses[j]
             }
    }

    console.log(classes)  
    // returns "persistent optional" or "persistent" or "optional"
    // leaves away all other classes

Если есть более простой способ отфильтровать эти два класса, я был бы рад дать ответ кому-нибудь.

СПАСИБО за все ваши усилия и извините за то, что не сказал точно, что мне нужно.

0 голосов
/ 05 января 2012

Я создал jsfiddle для выбора элементов, которые содержат только указанные классы.

http://jsfiddle.net/hYgqS/

вот пример HTML 

<div class="a1 a2 b">
1
</div>
<div class="a1 a2">
2
</div>

вот JSкод 

$('div.a1.a2').filter(function(){
return $(this).attr('class').split(' ').length ==2
}).text("this one");
0 голосов
/ 05 января 2012

Вы можете использовать метод addClass () , чтобы назначать имена классов для набора ранее сопоставленных элементов: 

$("th").addClass("persistent optional")
0 голосов
/ 05 января 2012

Для пересечения вам нужно filter('.persistent.optional'), без пробелов, без запятых.

0 голосов
/ 05 января 2012

Чтобы выбрать только элементы с постоянным и необязательным классом, попробуйте следующее: 

$('th[class="persistent optional"], th[class="optional persistent"]')

Это не сработает, будут дополнительные пробелы.Если вам нужно обработать такие случаи, передайте функцию фильтру: 

$('th').filter(function(){ 
    return this.className.match(/^\s*(persistent\s+optional|optional\s+persistent)\s*$/);
})
...