尚硅谷javaWeb书城项目第一阶段用js实现

最新推荐文章于 2023-03-26 15:48:14 发布

玏毋

最新推荐文章于 2023-03-26 15:48:14 发布

阅读量329

点赞数

文章标签： javascript 前端开发语言 web

本文链接：https://blog.csdn.net/qq_45706504/article/details/124660965

版权

尚硅谷javaweb书城项目第一阶段
没有使用jQuery
视频中用的是jQuery，我没有学这个，就根据给的代码改成了js，正好可以练习一下js。目前还没有写验证码功能。试了一下，可以运行成功。
这里主要的改动就是将错误提示信息加了个id属性。用getElementById来操作错误提示信息。通过var spanObj = document.getElementById(“span”)这个语句;创建一个span标签的对象，根据 spanObj.innerHTML = “用户名不合法!” ,对span标签里的内容进行赋值（因为innerHTML这个方法是可读可写的，就是说我们不仅能读到标签里面的内容，还可以修改标签里的内容），从而达到提示不同错误信息的目的。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>尚硅谷会员注册页面</title>
		<link type="text/css" rel="stylesheet" href="../../static/css/style.css" >
		<script type="text/javascript" src="../../static/script/jquery-1.7.2.js"></script>
		<script type="text/javascript">
			//页面加载完成之后
			window.onload = function () {
     
				//给注册绑定单击事件
				document.getElementById("sub_btn").onclick = function () {
     
					//验证用户名：必须由字母，数字下划线组成，并且长度为5到12位
					//1 获取用户名输入框里的内容
					var usernameText = document.getElementById("username").value;
					//2 创建正则表达式对象
					var usernamePatt = /^\w{5,12}$/;

					var spanObj = document.getElementById("span");
					//alert(errMsgObj);

					//3 使用test方法验证
					if(!usernamePatt.test(usernameText)){
     
						//4 提示用户结果
						//usernameObj.innerHTML = "用户名不合法！"
						spanObj.innerHTML = "用户名不合法!";
						//$("span.errorMsg").text("用户名不合法！");
						return false;
					}

					/

最低0.47元/天解锁文章

玏毋

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
尚硅谷javaWeb书城项目第一阶段用js实现

尚硅谷javaweb书城项目第一阶段没有使用jQuery视频中用的是jQuery，我没有学这个，就根据给的代码改成了js，正好可以练习一下js。目前还没有写验证码功能。试了一下，可以运行成功。这里主要的改动就是将错误提示信息加了个id属性。用getElementById来操作错误提示信息。通过var spanObj = document.getElementById(“span”)这个语句;创建一个span标签的对象，根据 spanObj.innerHTML = “用户名不合法!” ,对span标签里
复制链接

扫一扫