jQuery元素的隐藏与显示实例


Posted in Javascript onJanuary 20, 2015

本文实例讲述了jQuery元素的隐藏与显示的方法。分享给大家供大家参考。具体实现方法如下:

<html xmlns="http://www.w3.org/1999/xhtml">  

<head runat="server">  

    <title></title>  

    <script type="text/jscript" src="jquery/jquery-1.10.2.js"></script>  

    <script type="text/javascript">  

        $(document).ready(function () {  

            $("#but1").click(function () {  

                $("#tex1").hide();  

            });  

        })  

        $(document).ready(function () {  

            $("#but2").click(function () {  

                $("#tex1").show();  

            });  

        })      

    </script>  

</head>  

<body>  

    <form id="form1" runat="server">  

    <div>  

    <input type="button" value="客户端隐藏"  onclick="document.getElementById('tex1').style.display='none'" />  

    <input type="button" value="客户端显示"  onclick="document.getElementById('tex1').style.display='inline'" />  

    <input type="button" value="$客户端隐藏" id="but1" />  

    <input type="button" value="$客户端显示" id="but2" />  

    <input type="text" id="tex1" />  

    </div>  

    </form>  

</body>  

</html>

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

Javascript 相关文章推荐
Document对象内容集合(比较全)
Sep 06 Javascript
网页中返回顶部代码(多种方法)另附注释说明
Apr 24 Javascript
Jquery加载时从后台读取数据绑定到dropdownList实例
Jun 09 Javascript
javascript读取xml实现javascript分页
Dec 13 Javascript
JS判断客户端是手机还是PC的2个代码
Apr 12 Javascript
理解javascript中的回调函数(callback)
Sep 02 Javascript
Javascript获取表单名称(name)的方法
Apr 02 Javascript
JavaScript中isPrototypeOf函数作用和使用实例
Jun 01 Javascript
轻松学习Javascript闭包函数
Dec 15 Javascript
JS日期对象简单操作(获取当前年份、星期、时间)
Oct 26 Javascript
ES6新增数据结构WeakSet的用法详解
Aug 07 Javascript
es6中let和const的使用方法详解
Feb 24 Javascript
DOM基础教程之使用DOM设置文本框
Jan 20 #Javascript
DOM基础教程之使用DOM控制表单
Jan 20 #Javascript
DOM基础教程之使用DOM控制表格
Jan 20 #Javascript
jQuery实现tag便签去重效果的方法
Jan 20 #Javascript
js实现class样式的修改、添加及删除的方法
Jan 20 #Javascript
DOM基础教程之事件类型
Jan 20 #Javascript
js使用DOM设置单选按钮、复选框及下拉菜单的方法
Jan 20 #Javascript
You might like
Terran历史背景
2020/03/14 星际争霸
也谈php网站在线人数统计
2008/04/09 PHP
ThinkPHP中自定义错误页面和提示页面实例
2014/11/22 PHP
php实现使用正则将文本中的网址转换成链接标签
2014/12/03 PHP
MacOS 安装 PHP的图片裁剪扩展Tclip
2015/03/25 PHP
在php7中MongoDB实现模糊查询的方法详解
2017/05/03 PHP
php常用字符串长度函数strlen()与mb_strlen()用法实例分析
2019/06/25 PHP
基于jQuery图片平滑连续滚动插件
2009/04/27 Javascript
关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题
2010/12/08 Javascript
jQuery ready函数滥用分析
2011/02/16 Javascript
有关于JS辅助函数inherit()的问题
2013/04/07 Javascript
浅析Node.js中的内存泄漏问题
2015/06/23 Javascript
使用Angular和Nodejs、socket.io搭建聊天室及多人聊天室
2015/08/21 NodeJs
基于JS实现移动端访问PC端页面时跳转到对应的移动端网页
2020/12/24 Javascript
jQuery EasyUI编辑DataGrid用combobox实现多级联动
2016/08/29 Javascript
Angular2自定义分页组件
2017/04/19 Javascript
Angular设置别名alias的方法
2018/11/08 Javascript
微信小程序时间选择插件使用详解
2018/12/28 Javascript
vue-cli3 项目优化之通过 node 自动生成组件模板 generate View、Component
2019/04/30 Javascript
layui实现checkbox的目录树tree的例子
2019/09/12 Javascript
vue 导航菜单刷新状态不消失,显示对应的路由界面操作
2020/08/06 Javascript
[36:33]Ti4 循环赛第四日 附加赛NEWBEE vs Mouz
2014/07/13 DOTA
python获得linux下所有挂载点(mount points)的方法
2015/04/29 Python
django 创建过滤器的实例详解
2017/08/14 Python
Python WXPY实现微信监控报警功能的代码
2017/10/20 Python
利用Python将文本中的中英文分离方法
2018/10/31 Python
Python 实现PS滤镜的旋涡特效
2020/12/03 Python
CSS3等相关属性制作分页导航实现代码
2012/12/24 HTML / CSS
浅谈CSS3 动画卡顿解决方案
2019/01/02 HTML / CSS
关于HTML5 Placeholder新标签低版本浏览器下不兼容的问题分析及解决办法
2016/01/27 HTML / CSS
售后专员岗位职责
2013/12/08 职场文书
中药学专业毕业生推荐信
2014/07/10 职场文书
婚内房产协议书范本
2014/10/02 职场文书
老公写给老婆的检讨书
2015/05/06 职场文书
2015年教师节广播稿
2015/08/19 职场文书
Python可变集合和不可变集合的构造方法大全
2021/12/06 Python