jquery -如何设置父属性?

I'm trying to write an if statement where if one of the elements has it's display set to "none", I want the parent element to also display "none"...

我正在尝试编写一个if语句，如果其中一个元素的显示设置为“none”，我希望父元素也显示“none”……

This is the code I'm trying, which doesn't work...

这是我正在尝试的代码，它不起作用……

/* 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');
}

The markup looks like this:

标记如下:

<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 个解决方案

#1

Try this:

试试这个:

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

Better yet:

更好的是:

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

This example works for me. To hide/display the parent, toggle the child's display between none and inline:

这个例子对我有用。要隐藏/显示父节点，可在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>

#2

.attr is used for tags such as id, title, alt, src, etc.

.attr用于id、title、alt、src等标签。

.css is used for CSS styles such as display, font, text-decoration: blink, etc.

. CSS是用于CSS样式，如显示，字体，文字装饰:闪烁等。

Pygorex1's solution ought to do the trick.

Pygorex1的解决方案应该可以达到这个目的。

#3

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

#4

From your code examples, you already have an ID for the parent, so why not use it?

从您的代码示例中，您已经有了父类的ID，所以为什么不使用它呢?

Also, there are many other ways to do this (wrap the lines below inside a $(document).ready(function(){...})) to make them work:

另外，还有许多其他的方法(将下面的行包装在$(文档).ready(函数(){…})中)以使它们工作:

Using a :hidden selector (this will only hide):

使用:隐藏选择器(这只会隐藏):

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

Use a ternary operator (this will hide or show the parent)

使用三元运算符(这将隐藏或显示父操作符)

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

JQuery uses a few shortcuts:

JQuery使用了一些快捷方式:

:hidden will find objects that are hidden (or are set to display: none). It doesn't have to be inside an .is() either. You can use this: $('div:hidden').show() to reveal all hidden divs.
:hidden将找到隐藏的对象(或设置为:none)。它也不必在。is()里面。可以使用$('div:hidden').show()来显示所有隐藏的div。
:visible will find objects that are not hidden (display = '', 'inline', 'block', etc)
:可见将会发现不隐藏的对象(显示= "，'内联'，'block'等)
$(element).hide() will hide an element (sets display to none)
$(元素).hide()将隐藏一个元素(设置为none)
$(element).show() will show an element (clears display value)
$(元素).show()将显示一个元素(清除显示值)

#1