: пустой селектор не работает на столбце с якорями в некоторых ячейках?

Question

У меня есть таблица, в которой есть пара столбцов, в которых нет обязательных полей. На этой странице есть механизм фильтрации содержимого из таблицы, который выполняется на стороне клиента, и я использую jQuery для выбора скрываемых элементов, однако, похоже, что все работает не так, как ожидалось. Это работает нормально, если я фильтрую по какой-то строке, однако поведение пустого фильтра должно оставлять только те строки с пустыми ячейками в этом столбце.

Пример таблицы:

<table>
  <tr>
    <td class="firstCol">Some text</td>
    <td class="secondCol"><a href="##">A link!</a></td>
  </tr>
  <tr>
    <td class="firstCol"></td>
    <td class="secondCol"></td>
  </tr>
</table>

Для первого столбца я делаю что-то вроде:

$('table tr').find('.firstCol:not(:empty)').parent().hide();

Это работает для этого столбца. Все, что останется видимым, - это строки без содержимого в первом столбце.

Если я это сделаю:

$('table tr').find('.secondCol:not(:empty)').parent().hide();

Все строки из столбца 2 удалены. Есть ли общий способ выбрать это, чтобы возвращать только <td> s, соответствующие этому поведению, когда у них нет контента? Не то чтобы это имело значение, но это сгенерированные строки из запроса, и я проверил в браузере, и в ячейке нет содержимого.

Заранее спасибо.

Answer 1

Хотя @Steve является функционально корректным, это должно работать для всех элементов, которые не были видны в инструментах разработчика Chrome, а были символами, которые в Chrome и FireFox jQuery замечают при оценке :empty, которые Internet Explorer не делает.Я подумал, что должен поделиться тем, что нашел.

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

<td class="secondCol">
   <CFIF firstColVal NEQ "">
      <a href='##' value="#firstColVal#"></a>
   </CFIF>
</td>

Просмотр вывода HTML в Chrome ячейка без содержимогоотображается как:

<td class="secondCol"></td>

Когда я копирую и вставляю его во время проверки в Chrome, я получаю следующее:

<td class="secondCol">
                                      </td>

InternetExplorer игнорировал новую строку и пробел при рассмотрении :empty пока Chrome и FireFox этого не сделали.Это с jQuery 1.7.1.

Answer 2

Я не уверен, что понимаю вашу проблему. Взгляните на это jsFiddle . Он делает именно то, что вы хотите.

$('table tr').find('.firstCol:not(:empty)').parent().hide();

Если в firstCol td есть контент, то скрыть tr, содержащий его (включая secondCol td, независимо от того, есть ли у него контент или нет).

$('table tr').find('.secondCol:not(:empty)').parent().hide();

Если в secondCol td есть контент, то скрыть tr, содержащий его (включая firstCol td, независимо от того, есть ли у него контент или нет).

С предоставленным вами HTML-кодом оба фрагмента JS в конечном итоге делают одно и то же. Они прячут первую тр.