JQuery - как установить родительский атрибут? - PullRequest
5 голосов
/ 16 декабря 2009

Я пытаюсь написать оператор if, в котором если для одного из элементов установлено отображение «none», я хочу, чтобы родительский элемент также отображал «none» ...

Это код, который я пытаюсь, который не работает ...

/* tried this first */
if($('#prevx a').attr('display') == 'none') {
    $(this).parent().attr('display','none');
}

/* and then this */
if($('#prevxa > a').attr('display') == 'none') {
    $('#prevxa').attr('display','none');
}

Разметка выглядит так:

<ul>
   <li class="navnext" id="nextxa">
      <a id="nextx" href="#"><img src="/images/next.png"/></a>
   </li>

   <li class="navprev" id="prevxa">
      <a id="prevx" href="#" style="display: none;"><img src="/images/previous.png"/></a>
   </li>
</ul>

Ответы [ 4 ]

8 голосов
/ 16 декабря 2009

Попробуйте это:

if($('#prevx').css('display') == 'none') {
    $('#prevx').parent().css('display','none');
}

Еще лучше:

$('#prevx').parent().css('display',$('#prevx').css('display'));

Этот пример работает для меня. Чтобы скрыть / отобразить родительский элемент, переключите отображение дочернего элемента между none и inline:

<ul>
   <li class="navnext" id="nextxa">
      <a id="nextx" href="#"><img src="/images/next.png"/></a>
   </li>

   <li class="navprev" id="prevxa">
      <a id="prevx" href="#" style="display: inline;"><img src="/images/previous.png"/></a>
   </li>
</ul>

<script>
if ($('#prevx').css('display') == 'none') 
    $('#prevx').parent().css('display', 'none');
else
    $('#prevx').parent().css('display', 'list-item');
</script>
0 голосов
/ 16 декабря 2009

Из примеров кода у вас уже есть идентификатор для родителя, так почему бы не использовать его?

Кроме того, есть много других способов сделать это (обернуть строки ниже внутри $(document).ready(function(){...})), чтобы заставить их работать:

Использование селектора :hidden (это будет скрывать только):

if ($('#prevx').is(':hidden')) $('#prevxa').hide();

Используйте троичный оператор (это скроет или покажет родителя)

var showOrHide = ($('#prevx').is(':hidden')) ? 'none' : '';
$('#prevxa').css('display', showOrHide);

JQuery использует несколько ярлыков:

  • :hidden найдет объекты, которые скрыты (или настроены на отображение: нет). Он также не должен быть внутри .is(). Вы можете использовать это: $('div:hidden').show() чтобы раскрыть все скрытые элементы.
  • :visible найдет объекты, которые не являются скрытыми (display = '', 'inline', 'block' и т. Д.)
  • $(element).hide() скрывает элемент (не отображает ничего)
  • $(element).show() покажет элемент (очищает отображаемое значение)
0 голосов
/ 16 декабря 2009
if($('#prevx a').css('display') === 'none') {
    $(this).parent().css('display','none');
}
0 голосов
/ 16 декабря 2009

.attr используется для таких тегов, как id, title, alt, src и т. Д.

.css используется для таких стилей CSS, как отображение, шрифт, оформление текста: мигание и т. Д.

Решение Pygorex1 должно сработать.

...