jQuery判断元素是否显示 是否隐藏的简单实现代码

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判断元素是否显示 是否隐藏的简单实现代码就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • JQuery显示隐藏页面元素的方法总结

    在jquery中显示隐藏div方法方法有很多种,如比较简单的函数show(),hide(),toggle(),slideDown()然后还有css设置div的style属性都可操作,下面我来介绍. show()方法 显示出隐藏的 <p> 元素. 复制代码 代码如下: $(".btn2").click(function(){   $("p").show(); }); toggle()方法 toggle() 方法切换元素的可见状态. 如果被选元素可见,则隐藏

  • jQuery元素的隐藏与显示实例

    本文实例讲述了jQuery元素的隐藏与显示的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml">  <head runat="server">      <title></title>      <script type="text/jscript" src="jquery/jqu

  • jQuery控制元素显示、隐藏、切换、滑动的方法总结

    jQuery 隐藏和显示 通过 hide() 和 show() 两个函数,jQuery 支持对 HTML 元素的隐藏和显示: 实例 复制代码 代码如下: $("#hide").click(function(){ $("p").hide(); }); $("#show").click(function(){ $("p").show(); }); hide() 和 show() 都可以设置两个可选参数:speed 和 callba

  • 怎样判断jQuery当前元素是隐藏还是显示

    $(this).is(":hidden"); //如果元素是隐藏的话,则返回true is挺好用的,他能够用jQuery选择器作为参数,特别是跟jQuery里面的选择器里面那些以冒号开头的筛选符配合使用,实现各种各样的判断.如: ":checked,:hidden"等等.给个例子: <head> <script src="jquery-1.7.1.js" type="text/javascript">&

  • Jquery显示和隐藏元素或设为只读(含Ligerui的控件禁用,实例说明介绍)

    一.隐藏和显示元素 复制代码 代码如下: $('#button_save_12').css('display', 'none');  // 隐藏按钮$('#button_save_12').css('display', 'display');  // 显示按钮 // 或者采取 复制代码 代码如下: $('#button_save_12').hide();$('#button_save_12').show(); 二.设为禁用,只读 复制代码 代码如下: $('#button_save_12').a

  • jQuery控制元素隐藏和显示

    1.jQuery隐藏和显示效果 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: $("#hide").click(function(){ $("p").hide(); }); //点击id="hide"元素时,隐藏所有<p>标签内容: $("#show").click(function(){ $("p").show(); }); //点击id=

  • Jquery显示、隐藏元素以及添加删除样式

    复制代码 代码如下: <script type="text/javascript"> $(function () { //当input获取焦点后将其兄弟标签label隐藏 $("input").focus(function () { $(this).siblings("label").hide(); }); }); $(function () { //input元素失去焦点 $("input").blur(func

  • jquery显示隐藏元素的实现代码

    $("#id").css('display','none'); $("#id").css('display','block'); 或 $("#id")[0].style.display = 'none'; $("#id")返回的是JQuery 它是个集合肯定没有display属性 $("#firstStep").hide(500);而且可以设置时间:("#firstStep").hide

  • JS加jquery简单实现标签元素的显示或隐藏

    显示: 复制代码 代码如下: var ul = document.getElementById("opinionSelect"); ul.style.display = 'block'; 隐藏:$("#opinionSelect").fadeOut("fast");

  • jQuery判断元素是否显示 是否隐藏的简单实现代码

    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(':visib

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

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

  • AngularJS实现DOM元素的显示与隐藏功能

    本文实例讲述了AngularJS实现DOM元素的显示与隐藏功能.分享给大家供大家参考,具体如下: DOM元素的显示与隐藏 ,是前端开发中常常会用到的功能,AngularJS中是使用 ng-hide/ng-show 两个属性来实现的其实我们只要使用其中的一个属性即可实现所有功能他们的取值为 boolean. [HTML代码] <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <m

  • jQuery判断元素上是否绑定了指定事件的方法

    本文实例讲述了jQuery判断元素上是否绑定了指定事件的方法.分享给大家供大家参考.具体如下: 例如下面的代码可以判断id=testdiv的元素是否绑定的click事件,这个判断只针对jQuery绑定的事件有效,普通JS的事件绑定无效. //jQuery event封装支持判断元素上是否绑定了事件,此方法只适用于jQuery绑定的事件 var $events = $("#testdiv").data("events"); if( $events &&

  • 关于jQuery判断元素是否存在的问题示例探讨

    是这样的,最近做jQuery训练时遇到jQuery判断元素是否存在时出现问题. 题目如下:请在"选择按钮3"后面,添加Id=rad4,处于选择状态的,之后文字为"选择按钮4"的HTML控件,只能添加一次(自由选择使用js原生或JQuery实现 function addradio() { if (!document.getElementById("rad4")) { var main = document.getElementById("

  • jQuery实现菜单的显示和隐藏功能示例

    jQuery实现菜单的显示和隐藏功能示例

    本文实例讲述了jQuery实现菜单的显示和隐藏功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net jQuery显示菜单隐藏和显示</title> </head> <body> <script src="h

  • uniapp开发小程序实现滑动页面控制元素的显示和隐藏效果

    uniapp开发小程序实现滑动页面控制元素的显示和隐藏效果

    前言 实现思路:通过小程序API中的触摸事件,配合CSS来实现元素的显示和隐藏.ps(也想过另一种通过监听页面滚动的方式来实现,不过效果一定很差0.0) 一.需要用到的事件touchmove.touchend 二.话不多说上代码 1.看需求,如果是整个屏幕滑动后元素发生变化,最好放在最外面的view 代码如下: <view class="container" @touchmove="handletouchstart" @touchend="handl

  • vue.js 左侧二级菜单显示与隐藏切换的实例代码

    废话不多说了,直接给大家贴代码了, 完整代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>vue点击切换显示隐藏</title> <script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script> <style type

  • js判断主流浏览器类型和版本号的简单实现代码

    如今的互联网中,浏览器可以说是太多太多了,但是大部分都是换壳不换心,基本上主流的浏览器还是火狐,谷歌,IE,safrai这几种比较常见,所以在我们的开发中,有时候需要遇到判断用户正在使用什么浏览器以及使用的版本是多少,并根据返回值,给予一定的提示,下面,我就简单的介绍一种判断用户浏览器的使用情况的代码. var distinguishBrowser= function browserInfo() { var browser = { // IE浏览器 msie: false, // 谷歌浏览器 c

  • 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

随机推荐