我正在尝试写一个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>
答案 0 :(得分:8)
试试这个:
if($('#prevx').css('display') == 'none') {
$('#prevx').parent().css('display','none');
}
更好的是:
$('#prevx').parent().css('display',$('#prevx').css('display'));
这个例子适合我。要隐藏/显示父项,请在无和内联之间切换子项的显示:
<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>
答案 1 :(得分:0)
.attr用于id,title,alt,src等标签。
.css用于CSS样式,如显示,字体,文本修饰:闪烁等。
Pygorex1的解决方案应该可以解决问题。
答案 2 :(得分:0)
if($('#prevx a').css('display') === 'none') {
$(this).parent().css('display','none');
}
答案 3 :(得分:0)
从您的代码示例中,您已经拥有父级的ID,那么为什么不使用它呢?
此外,还有很多其他方法可以做到这一点(将下面的行包裹在$(document).ready(function(){...})
内)以使它们工作:
使用:hidden
selector(这只会隐藏):
if ($('#prevx').is(':hidden')) $('#prevxa').hide();
使用ternary operator(这将隐藏或显示父级)
var showOrHide = ($('#prevx').is(':hidden')) ? 'none' : '';
$('#prevxa').css('display', showOrHide);
JQuery使用了一些快捷方式:
:hidden
将找到隐藏的对象(或设置为display:none)。它也不必在.is()
内。您可以使用此$('div:hidden').show()
来显示所有隐藏的div。:visible
会找到未隐藏的对象(display ='','inline','block'等)$(element).hide()
将隐藏元素(将显示设置为无)$(element).show()
将显示一个元素(清除显示值)答案 4 :(得分:0)
尝试一下
$('#child_id').parent().css('display','none');