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 相关文章推荐
js 实现在离开页面时提醒未保存的信息(减少用户重复操作)
Jan 16 Javascript
jQuery实现列表自动循环滚动鼠标悬停时停止滚动
Sep 06 Javascript
JavaScript实现计算字符串中出现次数最多的字符和出现的次数
Mar 12 Javascript
JavaScript实现基于十进制的四舍五入实例
Jul 17 Javascript
jQuery实现高亮显示网页关键词的方法
Aug 07 Javascript
javascript九宫格图片随机打乱位置的实现方法
Mar 15 Javascript
vue Render中slots的使用的实例代码
Jul 19 Javascript
Bootstrap 树控件使用经验分享(图文解说)
Nov 06 Javascript
vue 每次渲染完页面后div的滚动条保持在最底部的方法
Mar 17 Javascript
详解vue引入子组件方法
Feb 12 Javascript
JS面向对象实现飞机大战
Aug 26 Javascript
微信小程序实现打卡签到页面
Sep 21 Javascript
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/10/09 PHP
PHP冒泡算法详解(递归实现)
2014/11/10 PHP
PHP设计模式之观察者模式定义与用法分析
2019/04/04 PHP
javascript下给元素添加事件的方法与代码
2007/08/13 Javascript
“不能执行已释放的Script代码”错误的原因及解决办法
2007/09/09 Javascript
javascript 面向对象编程基础:继承
2009/08/21 Javascript
Ext grid 添加右击菜单
2009/11/26 Javascript
javascript 导出数据到Excel(处理table中的元素)
2009/12/18 Javascript
14个有用的Jquery技巧分享
2015/01/08 Javascript
jQuery中noConflict()用法实例分析
2015/02/08 Javascript
BootStrap 附加导航组件
2016/07/22 Javascript
深入分析node.js的异步API和其局限性
2016/09/05 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
用React-Native+Mobx做一个迷你水果商城APP(附源码)
2017/12/25 Javascript
jQuery实现表单动态添加与删除数据操作示例
2018/07/03 jQuery
vue柱状进度条图像的完美实现方案
2019/08/26 Javascript
JS多个异步请求 按顺序执行next实现解析
2019/09/16 Javascript
微信小程序实现轨迹回放的示例代码
2019/12/13 Javascript
JavaScript如何判断input数据类型
2020/02/06 Javascript
如何用JS模拟实现数组的map方法
2020/07/30 Javascript
JavaScript 事件代理需要注意的地方
2020/09/08 Javascript
仿照Element-ui实现一个简易的$message方法
2020/09/14 Javascript
[03:39]2015国际邀请赛主赛事首日精彩回顾
2015/08/05 DOTA
Python计算程序运行时间的方法
2014/12/13 Python
使用C语言来扩展Python程序和Zope服务器的教程
2015/04/14 Python
浅析Python的web.py框架中url的设定方法
2016/07/11 Python
Python递归实现汉诺塔算法示例
2018/03/19 Python
使用python求解二次规划的问题
2020/02/29 Python
Python 将 QQ 好友头像生成祝福语的实现代码
2020/05/03 Python
基于CSS3实现图片模糊过滤效果
2015/11/19 HTML / CSS
C&A巴西网上商店:时尚、衣服、手机和鞋子
2020/06/07 全球购物
Java程序开发中如何应用线程
2016/03/03 面试题
国际商务系学生个人的自我评价
2013/11/26 职场文书
活动总结格式范文
2014/04/26 职场文书
加强机关作风建设心得体会
2014/10/22 职场文书
小学师德师风整改措施
2014/10/27 职场文书