判断jQuery元素是否隐藏

第一种:使用CSS属性

复制代码 代码如下:

var display =$(‘#id‘).css(‘display‘);
if(display == ‘none‘){
   alert("被你发现了,我是隐藏的啦!");
}

第二种:使用jquery内置选择器

假设我们页面有这么个标签,

复制代码 代码如下:

<div id="test">
< p>仅仅是测试所用</p>
< /div>

那么,我们可以用以下语句来判断id为"test"的标签是否隐藏:

复制代码 代码如下:

if($("#test").is(":hidden")){...} //前提是已经将jQuery的库导进来了

这样,我们就能够很简单地判断一个元素是否隐藏,并根据其状态来设置动画,比如:

复制代码 代码如下:

if($("#test").is(":hidden")){
       $("#test").show();    //如果元素为隐藏,则将它显现
}else{
      $("#test").hide();     //如果元素为显现,则将其隐藏
}

jQuery判断元素是否显示 是否隐藏

复制代码 代码如下:

var node=$(‘#id‘);

第一种写法

复制代码 代码如下:

if(node.is(‘:hidden‘)){  //如果node是隐藏的则显示node元素,否则隐藏

  node.show(); 

}else{

  node.hide();

}

第二种写法

复制代码 代码如下:

if(!node.is(‘:visible‘)){  //如果node是隐藏的则显示node元素,否则隐藏

  node.show(); 

}else{

  node.hide();

}

if(node.is(‘:visible‘)){  //如果node是显示的则隐藏node元素,否则显示

  node.hide();

}else{

  node.show();

}

jQuery判断对象是否显示或隐藏

Js代码

复制代码 代码如下:

// jQuery("#tanchuBg").css("display") 
// jQuery("#tanchuBg").is(":visible") 
// jQuery("#tanchuBg").is(":hidden")

Js代码

复制代码 代码如下:

$(element).is(":visible") // Checks for display:[none|block], ignores visible:[true|false]

Js代码

复制代码 代码如下:

$(‘element:hidden‘) 
$(‘element:visible‘)

Js代码

复制代码 代码如下:

$(".item").each(function() 

    if ($(this).css("visibility") == "hidden") 
    { 
        // handle non visible state 
    } 
    else 
    { 
        // handle visible state 
    } 
})

Js代码

复制代码 代码如下:

ar isVisible = $(‘#myDiv‘).is(‘:visible‘); 
var isHidden = $(‘#myDiv‘).is(‘:hidden‘);

Js代码

复制代码 代码如下:

if( $(this).css("display") == ‘none‘ ){ 
 
    /* your code here*/ 

else{ 
 
    /*  alternate logic   */ 
}

时间: 2024-10-18 18:36:02

判断jQuery元素是否隐藏的相关文章

jquery判断元素是否隐藏的多种方法

第一种:使用CSS属性 复制代码 代码如下: var display =$('#id').css('display'); if(display == 'none'){    alert("被你发现了,我是隐藏的啦!"); } 第二种:使用jquery内置选择器 假设我们页面有这么个标签, 复制代码 代码如下: <div id="test">< p>仅仅是测试所用</p>< /div> 那么,我们可以用以下语句来判断id

jQuery判断当前元素显示状态并控制元素的显示与隐藏

1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible');   //true为显示,false为隐藏 $("#id").is(':hidden');   //true为隐藏,false为显示 if($("#id").is(':hidden')){ //逻辑代码 } 2.jQuery控制css的display $("#id").show();    //表示display:block $

Js - 判断元素是否隐藏、显示

判断元素是否隐藏.显示的方法,需要的朋友可以参考下 : 1.通过判断元素display属性状态值来实现 console.log($('div').css("display"));       // inlineif($('div').css("display") != 'none') { console.log('aaaaa');       // aaaaa $('div').hide();         console.log($('div').css(&qu

jQuery 判断页面元素是否存在

在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的. 例如: document.getElementById("someID").innerHTML("hi"); 如果ID为"someID"的元素不存在,我们将得到Javascript运行错误:document.getElementById("someID") is null 正确的写法应该

jQuery -- 如何使用jQuery判断某个元素是否存在

通常我们要判断某个元素是否存在是用: [javascript] view plaincopy if(document.getElementById('example')) { // do something } else { // do something else } 然而在使用jQuery时,我们可以使用: [javascript] view plaincopy if($('#example').length) { // do something } else { // do somethi

jquery控制元素的隐藏和显示的几种方法。

组织略显凌乱,请耐心看! 使用jquery控制div的显示与隐藏,一句话就能搞定,例如: 1.$("#id").show()表示为display:block, $("#id").hide()表示为display:none; 2.$("#id").toggle()切换元素的可见状态.如果元素是可见的,切换为隐藏的:如果元素是隐藏的,则切换为可见的. 3.$("#id").css('display','none');//隐藏 $(

jQuery无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案

用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢工了. 用Chrome自带的开发工具一查,发现罢工的Tab中.小插件一些重要元素的宽度都变成“0”了,因为这个小插件需要计算动态宽度来实现,于是马上想到是小插件中的宽度获取失败了,果不其然. 汗,居然一直没发现jQuery无法获取隐藏元素(display:none)的宽度(width)和高度(height),为了兼容IE6,我用1.x版,而且是官方

jQuery基础 -- 如何判断页面元素存在与否

在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的.例如: document.getElementById("someID").innerText("hi"); 如果ID为"someID"的元素不存在,我们将得到Javascript运行错误:document.getElementById("someID") is null 正确的写法应该是

jQuery判断当前元素是第几个元素&amp;获取第N个元素

jQuery判断当前元素是第几个元素&获取第N个元素 假设有下面这样一段HTML代码: <ul> <li>jQuery判断当前元素是第几个元素示例</li> <li>jQuery获取第N个元素示例</li> <li>jQuery选择器示例</li> </ul> jQuery判断当前元素是第几个元素 如果我们点击任何一个li标签,想知道当前点击的是第几个li标签,可以使用下面的代码: $("ul