web界面 之 登录 (初稿)

web登录一般注意以下几点:

1)拥有元素:用户名,密码(密码字符显示与隐藏功能),登录按钮,忘记密码链接(忘记用户名链接),注册链接

2)用户体验:

•页面显示,光标默认停在第一个输入框 利用html5的 autofocus属性实现

•密码默认以....显示,利用input标签的 type="password"实现

•点击登录按钮后,利用ajax技术先验证用户名是否存在,密码是否正确,不正确要有合理的提示;正确才能进行页面跳转

•禁掉css后 表单仍然显示比较好的格式

 

<fieldset id="login">
        <legend>后台登录系统</legend>
        <form>
            <p>
                <label>用户名
                    <input name="name" class="name" type="text" id="name" value="" autofocus="autofocus"  />
                </label>
            </p>
            <p>
                <label>密&#12288;码
                    <input name="password" class="password" type="password" id="password" value="" />
                </label>
            </p>
            <p id="warning" class="warning"></p>
            <p>
                <input type="button" id="submitBtn" class="button" value="登录"/>
            </p>
        </form>
    </fieldset>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值