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


Posted in Javascript onMay 06, 2014

第一种:使用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   */  

} 
Javascript 相关文章推荐
Prototype RegExp对象 学习
Jul 19 Javascript
javascript向后台传送相同属性的参数即数组参数
Feb 17 Javascript
form.submit()不能提交表单的原因分析
Oct 23 Javascript
node.js中的fs.appendFileSync方法使用说明
Dec 17 Javascript
把Node.js程序加入服务实现随机启动
Jun 25 Javascript
基于JavaScript实现表单密码的隐藏和显示出来
Mar 02 Javascript
JS表格组件神器bootstrap table详解(强化版)
May 26 Javascript
在web中js实现类似excel的表格控件
Sep 01 Javascript
jQuery.cookie.js实现记录最近浏览过的商品功能示例
Jan 23 Javascript
javascript 正则表达式分组、断言详解
Apr 20 Javascript
关于javascript sort()排序你可能忽略的一点理解
Jul 18 Javascript
Angular5给组件本身的标签添加样式class的方法
Apr 07 Javascript
JQuery调用WebServices的方法和4个实例
May 06 #Javascript
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
May 05 #Javascript
JQuery以JSON方式提交数据到服务端示例代码
May 05 #Javascript
使用jQuery重置(reset)表单的方法
May 05 #Javascript
jQuery实现回车键(Enter)切换文本框焦点的代码实例
May 05 #Javascript
Js操作树节点自动折叠展开的几种方法
May 05 #Javascript
javascript中兼容主流浏览器的动态生成iframe方法
May 05 #Javascript
You might like
PHP将DateTime对象转化为友好时间显示的实现代码
2011/09/20 PHP
php网站地图生成类示例
2014/01/13 PHP
php获取英文姓名首字母的方法
2015/07/13 PHP
PHP通过反射动态加载第三方类和获得类源码的实例
2015/11/27 PHP
WordPress中创建用户角色的相关PHP函数使用详解
2015/12/25 PHP
Laravel与CI框架中截取字符串函数
2016/05/08 PHP
快速保存网页中所有图片的方法
2006/06/23 Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
2011/07/08 Javascript
jQuery判断checkbox是否选中的小例子
2013/12/02 Javascript
jQuery中bind()方法用法实例
2015/01/19 Javascript
Jquery插件实现点击获取验证码后60秒内禁止重新获取
2015/03/13 Javascript
JavaScript中的立即执行函数表达式介绍
2015/03/15 Javascript
javascript图片延迟加载实现方法及思路
2015/12/31 Javascript
js鼠标单击和双击事件冲突问题的快速解决方法
2016/07/11 Javascript
js enter键激发事件实例代码
2016/08/17 Javascript
Vuex之理解state的用法实例
2017/04/19 Javascript
多个Vue项目部署到服务器的步骤记录
2020/10/22 Javascript
nuxt.js服务端渲染中axios和proxy代理的配置操作
2020/11/06 Javascript
[05:39]2014DOTA2西雅图国际邀请赛 淘汰赛7月14日TOPPLAY
2014/07/14 DOTA
[00:34]DOTA2上海特级锦标赛 VG战队宣传片
2016/03/04 DOTA
python将字符串以utf-8格式保存在txt文件中的方法
2018/10/30 Python
python中执行smtplib失败的处理方法
2020/07/01 Python
Python绘图之柱形图绘制详解
2020/07/28 Python
python用分数表示矩阵的方法实例
2021/01/11 Python
HTML5利用约束验证API来检查表单的输入数据的代码实例
2016/12/20 HTML / CSS
中国包裹转运寄送国际服务:Famiboat
2019/07/24 全球购物
介绍一下HDLC(High-Level Data Link Control)高层数据链路协议
2012/01/21 面试题
实习教师自我鉴定
2013/12/09 职场文书
高中生职业规划范文
2014/03/09 职场文书
小学校长竞聘演讲稿
2014/05/16 职场文书
银行纠风工作实施方案
2014/06/08 职场文书
大四毕业生自荐书
2014/07/05 职场文书
办公室行政主管岗位职责
2015/04/09 职场文书
如何做好员工培训计划?
2019/07/09 职场文书
jQuery ajax - getScript() 方法和getJSON方法
2021/05/14 jQuery
移除Selenium中window.navigator.webdriver值
2022/06/10 Python