分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

Jquery实现检测用户输入用户名和密码不能为空

发布时间:2023-09-06 02:18责任编辑:沈小雨关键词:暂无标签

要求

1、用户名和密码为空点击登录时提示相应的提示
2、获取用户名输入框时,错误提示清除

思路

1、创建1个input-text标签和1个input-password标签,1个input-botton标签
2、把按钮绑定点击时间,然后检查所有输入框内容是否为空,为空则加上提示
3、把输入框绑定事件,获取焦点时清除提示

<!DOCTYPE html><html lang="zh-CN"><head> ???<meta charset="UTF-8"> ???<title>Title</title></head><body><!--设置用户名输入框--><label >用户名<input id="t1" class=‘info‘ type="text"> ???<!--空span标签用来后面绑定事件添加提示--> ???<span></span></label><hr><!--设置密码输入框--><label >密码 ???<input id="t2" class="info" type="password"> ????<!--空span标签用来后面绑定事件添加提示--> ???<span></span></label><hr><label id="b1"> ???<input type="button" value="登录"></label><script src="JQ.js"></script><script> ???// 按钮绑定点击事件 ???$(‘#b1‘).click(function () { ???????let $name=$(‘#t1‘); ???????let $pwd=$(‘#t2‘); ???????// 按钮点击后检查输入框是否为空,为空则找到span便签添加提示 ???????if ($name.val().length===0) ???????{ ???????????$name.next().text(‘用户名不能为空‘) ???????} ???????if($pwd.val().length===0) ???????{ ???????????$pwd.next().text(‘密码不能为空‘) ???????} ???}); ???// 给输入框添加时间,获取焦点时,将span标签中的内容设置成空 ???$(‘.info‘).focus(function () { ???????$(this).next().text(‘‘); ???})</script></body></html>

Jquery实现检测用户输入用户名和密码不能为空

原文地址:https://www.cnblogs.com/Kingfan1993/p/9813089.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved