js实现当复选框选择匿名登录时隐藏登录框效果


Posted in Javascript onAugust 14, 2015

本文实例讲述了js实现当复选框选择匿名登录时隐藏登录框效果。分享给大家供大家参考。具体如下:

本技巧是比较常见的,有些网站可以登录发帖或匿名发帖,当勾选复选框选择匿名发帖时,登录框自动隐藏了,是不是更人性化了?这其实是在表单元素上稍微加了一点JavaScript代码,具体实现方法请查看代码。

运行效果如下图所示:

js实现当复选框选择匿名登录时隐藏登录框效果

在线演示地址如下:

具体代码如下:

<title>当复选框选择匿名登录时隐藏登录框</title>
<style>.a #login,#uname{display:none;}.a #uname{display:inline;}</style>
<body>
<div>
<span id="login">帐号:<input type="text" /> 密码:<input type="text" /> <input type="submit" value="登录" /></span>
<span id="uname">网友姓名:<input type="text" /></span>
<input type="checkbox" id="check" onclick="this.parentNode.className=this.checked?'a':'';" />匿名</div>
</body>

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

Javascript 相关文章推荐
JavaScript传递变量: 值传递?引用传递?
Feb 22 Javascript
使用jQuery动态加载js脚本文件的方法
Apr 03 Javascript
js中直接声明一个对象的方法
Aug 10 Javascript
JS实现的通用表单验证插件完整实例
Aug 20 Javascript
Js删除数组中某一项或几项的几种方法(推荐)
Jul 27 Javascript
基于angularJS的表单验证指令介绍
Oct 21 Javascript
JavaScript编写的网页小游戏,很给力
Aug 18 Javascript
vue中Axios的封装与API接口的管理详解
Aug 09 Javascript
vue实现在一个方法执行完后执行另一个方法的示例
Aug 25 Javascript
详解Vue组件之作用域插槽
Nov 22 Javascript
利用JS如何获取form表单数据
Dec 19 Javascript
jQuery实现鼠标拖动图片功能
Mar 04 jQuery
JavaScript学习笔记之DOM基础 2.4
Aug 14 #Javascript
关于JavaScript的变量的数据类型的判断方法
Aug 14 #Javascript
js实现表单检测及表单提示的方法
Aug 14 #Javascript
JavaScript中的this关键字使用详解
Aug 14 #Javascript
JS实现双击编辑可修改状态的方法
Aug 14 #Javascript
JavaScript变量的作用域全解析
Aug 14 #Javascript
DEDECMS如何为文章添加HOT NEW标志图片
Aug 14 #Javascript
You might like
PHP 选项及相关信息函数库
2006/12/04 PHP
PHP安全技术之 实现php基本安全
2010/09/04 PHP
PHP基础之运算符的使用方法
2013/04/28 PHP
Laravel5.1 框架数据库操作DB运行原生SQL的方法分析
2020/01/07 PHP
JavaScript 给汉字排序实例代码
2008/06/28 Javascript
Jquery跨域获得Json时invalid label错误的解决办法
2011/01/11 Javascript
js Dialog 实践分享
2012/10/22 Javascript
js判断屏幕分辨率的代码
2013/07/16 Javascript
js计算两个时间之间天数差的实例代码
2013/11/19 Javascript
在NodeJS中启用ECMAScript 6小结(windos以及Linux)
2014/07/15 NodeJs
javascript实现仿腾讯游戏选择
2015/05/14 Javascript
jQuery中通过ajax调用webservice传递数组参数的问题实例详解
2016/05/20 Javascript
AngularJS模块详解及示例代码
2016/08/17 Javascript
Node.js配合node-http-proxy解决本地开发ajax跨域问题
2016/08/31 Javascript
vue 怎么创建组件及组件使用方法
2017/07/27 Javascript
JScript实现表格的简单操作
2017/08/15 Javascript
node.js+captchapng+jsonwebtoken实现登录验证示例
2017/08/17 Javascript
Webpack中publicPath路径问题详解
2018/05/03 Javascript
详解Vue 多级组件透传新方法provide/inject
2018/05/09 Javascript
通过webpack引入第三方库的方法
2018/07/20 Javascript
微信小程序实现日历功能
2018/11/27 Javascript
vue-cli3搭建项目的详细步骤
2018/12/05 Javascript
IE浏览器下JS脚本提交表单后,不能自动提示问题解决方法
2019/06/04 Javascript
详解django模板与vue.js冲突问题
2019/07/07 Javascript
Python使用sax模块解析XML文件示例
2019/04/04 Python
详解【python】str与json类型转换
2019/04/29 Python
如何使用python把ppt转换成pdf
2019/06/29 Python
Apache,wsgi,django 程序部署配置方法详解
2019/07/01 Python
PyCharm GUI界面开发和exe文件生成的实现
2020/03/04 Python
python读取图片颜色值并生成excel像素画的方法实例
2021/02/19 Python
详解css3 Transition属性(平滑过渡菜单栏案例)
2017/09/05 HTML / CSS
Html5在手机端调用相机的方法实现
2020/05/13 HTML / CSS
雷锋的观后感
2015/06/10 职场文书
求职信如何撰写?
2019/05/22 职场文书
PostGIS的安装与入门使用指南
2022/01/18 PostgreSQL
Java中的随机数Random
2022/03/17 Java/Android