zoukankan      html  css  js  c++  java
  • js实现自动登陆的按钮

    自动按钮,只要实现当移入是提示用户不要在公共地方使用自动登陆

    主要用onmouseover函数,本来提示div隐藏,当移入时div显示。

    <style type="text/css">
        body,input,p{margin:0;padding:0px;}
        body{font-size:12px;line-height:22px;font-family:tahoma;}
        #content{margin:10px auto;170px;}
        input {margin-right:5px;vertical-align:middle;}
        #tips{display:none;margin:5px;padding:5px;border:1px #f90 solid;background:#ffefad;}
        #tips2{display:none;margin:5px;padding:5px;border:1px #f90 solid;background:#ffefad;}
    </style>
    
    
    <div id="content">
        <label><input type="checkbox" />自动登陆</label>
        <div id="tips">为了你的安全,请不要在网吧或公共电脑使用该功能
        </div>
        <div id="tips2">
            你已勾选自动登陆。
        </div>
    </div>

    js部分代码

    <script>
        window.onload =function()
        {
            var obj=
            {
                tips:document.getElementById("tips"),
                lb:document.getElementsByTagName("label")[0],
                ip:document.getElementsByTagName("input")[0],
                div1:document.getElementById("tips2")
    
            };
            obj.lb.onmouseover=function(){
               obj.tips.style.display="block";
            }
             obj.lb.onmouseout=function(){
               obj.tips.style.cssText="display:none;";
            }
            obj.ip.onchange=function(){
                this.checked?obj.div1.style.display="block":obj.div1.style.display="none";
            }
        }
    </script>

    效果

  • 相关阅读:
    JavaScript 闭包+封装+异步同步区别
    CSS基础(三)盒子模型
    CSS基础(二)浮动
    CSS基础(一)
    HTML基础(二)
    JAVA 微信开发
    MAVEN学习总结1
    Java开发中的23种设计模式详解(转)
    navicat for mysql 10.1.7注册码
    jQuery.Validate验证库
  • 原文地址:https://www.cnblogs.com/biyongyao/p/5840027.html
Copyright © 2011-2022 走看看