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关于字符长度限制的问题示例探讨
Jan 24 Javascript
jQuery-ui引入后Vs2008的无智能提示问题解决方法
Feb 10 Javascript
jQuery实现自动滚动到页面顶端的方法
May 22 Javascript
原生js获取元素样式的简单方法
Aug 06 Javascript
JavaScript html5利用FileReader实现上传功能
Mar 27 Javascript
基于JS实现html中placeholder属性提示文字效果示例
Apr 19 Javascript
浅谈webpack4.x 入门(一篇足矣)
Sep 05 Javascript
AngularJS 监听变量变化的实现方法
Oct 09 Javascript
一些手写JavaScript常用的函数汇总
Apr 16 Javascript
在vue中使用el-tab-pane v-show/v-if无效的解决
Aug 03 Javascript
解决vue项目 build之后资源文件找不到的问题
Sep 12 Javascript
Vue双向数据绑定(MVVM)的原理
Oct 03 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 mysql Errcode: 28 终极解决方法
2009/07/01 PHP
深入php self与$this的详解
2013/06/08 PHP
国产PHP开发框架myqee新手快速入门教程
2014/07/14 PHP
Thinkphp 框架扩展之驱动扩展实例分析
2020/04/27 PHP
借助javascript代码判断网页是静态还是伪静态
2014/05/05 Javascript
js单独获取一个checkbox看其是否被选中
2014/09/22 Javascript
js与jquery回车提交的方法
2015/02/03 Javascript
通过node-mysql搭建Windows+Node.js+MySQL环境的教程
2016/03/01 Javascript
基于JavaScript FileReader上传图片显示本地链接
2016/05/27 Javascript
JSON 数据详解及实例代码分析
2017/01/20 Javascript
Vue中添加过渡效果的方法
2017/03/16 Javascript
bootstrap table单元格新增行并编辑
2017/05/19 Javascript
Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码
2017/08/22 Javascript
使用ngrok+express解决本地环境中微信接口调试问题
2018/02/26 Javascript
深入理解Vue 组件之间传值
2018/08/16 Javascript
微信小程序实现笑脸评分功能
2018/11/03 Javascript
vue组件之间数据传递的方法实例分析
2019/02/12 Javascript
微信小程序使用echarts获取数据并生成折线图
2019/10/16 Javascript
详谈Object.defineProperty 及实现数据双向绑定
2020/07/18 Javascript
python 如何快速找出两个电子表中数据的差异
2017/05/26 Python
python使用fork实现守护进程的方法
2017/11/16 Python
Sanic框架流式传输操作示例
2018/07/18 Python
python爬取微信公众号文章
2018/08/31 Python
Python函数中不定长参数的写法
2019/02/13 Python
python 字典操作提取key,value的方法
2019/06/26 Python
python怎么判断素数
2020/07/01 Python
用python实现一个简单计算器(完整DEMO)
2020/10/14 Python
python 下载文件的几种方法汇总
2021/01/06 Python
HTML5中外部浏览器唤起微信分享
2020/01/02 HTML / CSS
幼儿园园长岗位职责
2013/11/26 职场文书
初中美术教学反思
2014/01/29 职场文书
办公室主任岗位承诺书
2014/05/29 职场文书
如何写通讯稿
2015/07/22 职场文书
导游词之白茶谷九龙峡
2019/10/23 职场文书
python 使用Tensorflow训练BP神经网络实现鸢尾花分类
2021/05/12 Python
Pygame Draw绘图函数的具体使用
2021/11/17 Python