jQuery实现判断控件是否显示的方法


Posted in Javascript onJanuary 11, 2017

本文实例讲述了jQuery实现判断控件是否显示的方法。分享给大家供大家参考,具体如下:

核心代码:

if($("#elem_id").is(":hidden"))
{
}

实例代码1:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" src="jquery-1.4.2.js">
<!--
//-->
</script>
<script type="text/javascript">
<!--
$(document).ready(function(){
$("#btnToogle").click(function(){
$("#dvTest").toggle();
alert( $("#dvTest").is(":visible")); //判断元素显示或隐藏状态
});
$("#btnTestIs").click(function(e){
// alert( $(e.target).is("input") ); //判断元素的标名称
alert( $("#btnToogle").parent().is("body") );
});
});
//-->
</script>
</head>
<body>
<input type="button" value="toogle div" id="btnToogle">
<div style="width:50px; height:100px; border:solid 1px red; background-color:blue;" id="dvTest">
</div>
<br />
<hr />
<input type="button" value="toogle div" id="btnTestIs">
</body>
</html>

jQuery判断div是否隐藏实例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>绑定函数</title>
<script src="jquery-1.3.2.js"></script>
<script>
$(document).ready(function(){
var temp= $("#test").is(":hidden");//是否隐藏
var temp1= $("#test").is(":visible");//是否可见
alert(temp) ;
alert(temp1) ;
}); </script>
</head>
<body>
<p onclick='test()'>刷新测试</p>
<div id="test" style="display:none"></div>
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
完美解决JS中汉字显示乱码问题(已解决)
Dec 27 Javascript
23个Javascript弹出窗口特效整理
Feb 25 Javascript
js关闭父窗口时关闭子窗口
Apr 01 Javascript
JQuery Highcharts 动态生成图表的方法
Nov 15 Javascript
JS阻止冒泡事件以及默认事件发生的简单方法
Jan 17 Javascript
jQuery实现拖动调整表格单元格大小的代码实例
Jan 13 Javascript
javascript算法题:求任意一个1-9位不重复的N位数在该组合中的大小排列序号
Apr 01 Javascript
js移动焦点到最后位置的简单方法
Nov 25 Javascript
基于jQuery实现文字打印动态效果
Apr 21 jQuery
iscroll-probe实现下拉刷新和下拉加载效果
Jun 28 Javascript
Vue自定义指令上报Google Analytics事件统计的方法
Feb 25 Javascript
vue实现两个组件之间数据共享和修改操作
Nov 12 Javascript
jQuery Form表单取值的方法
Jan 11 #Javascript
vue实现ajax滚动下拉加载,同时具有loading效果(推荐)
Jan 11 #Javascript
浅谈JavaScript中promise的使用
Jan 11 #Javascript
JS多文件上传的实例代码
Jan 11 #Javascript
微信小程序开发(一) 微信登录流程详解
Jan 11 #Javascript
Javascript中return的使用与闭包详解
Jan 11 #Javascript
jQuery对table表格进行增删改查
Dec 22 #Javascript
You might like
php相当简单的分页类
2008/10/02 PHP
WordPress判断用户是否登录的代码
2011/03/17 PHP
解析PHP自带的进位制之间的转换函数
2013/06/08 PHP
PHP 5.6.11 访问SQL Server2008R2的几种情况详解
2016/08/08 PHP
php微信开发自定义菜单
2016/08/27 PHP
自动检查并替换文本框内的字符
2006/06/30 Javascript
Javascript 中的类和闭包
2010/01/08 Javascript
超级有用的13个基于jQuery的内容滚动插件和教程
2011/07/31 Javascript
基于javascript、ajax、memcache和PHP实现的简易在线聊天室
2015/02/03 Javascript
JavaScript中的Math.E属性使用详解
2015/06/12 Javascript
解决jquery中动态新增的元素节点无法触发事件问题的两种方法
2015/10/30 Javascript
AngularJS使用angular-formly进行表单验证
2015/12/27 Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
2016/06/17 Javascript
JS实现图片垂直居中显示小结
2016/12/13 Javascript
详解vue组件化开发-vuex状态管理库
2017/04/10 Javascript
JavaScript实现AOP详解(面向切面编程,装饰者模式)
2017/12/19 Javascript
JavaScript 类的封装操作示例详解
2020/05/16 Javascript
一百行python代码将图片转成字符画
2021/02/19 Python
浅谈python新式类和旧式类区别
2019/04/26 Python
python获取微信企业号打卡数据并生成windows计划任务
2019/04/30 Python
python的pytest框架之命令行参数详解(下)
2019/06/27 Python
Python3 requests模块如何模仿浏览器及代理
2020/06/15 Python
STAY JAPAN台湾:预订日本民宿
2018/07/22 全球购物
什么是URL
2015/12/13 面试题
会计与审计毕业生自荐信范文
2013/12/30 职场文书
5.12护士节演讲稿
2014/04/30 职场文书
安全教育演讲稿
2014/05/09 职场文书
2014年巴西世界杯口号
2014/06/05 职场文书
离婚协议书该怎么写
2014/10/04 职场文书
大学生就业协议书范本(适用于公司企业)
2014/10/07 职场文书
个人贷款收入证明
2014/10/26 职场文书
2015年复活节活动总结
2015/02/27 职场文书
终止劳动合同通知书
2015/04/16 职场文书
golang fmt格式“占位符”的实例用法详解
2021/07/04 Golang
python中取整数的几种方法
2021/11/07 Python
vue如何使用模拟的json数据查看效果
2022/03/31 Vue.js