6.3.5 实验步骤

6.3.5 实验步骤

任务1实验分解

(1) 打开HBuilderX 进入开发界面,选择“文件新建项目”菜单,进入新建项目界面。选择普通项目,输入项目名称“VerifyUserName”,并选择默认项目,点击创建按钮。

(2) 在项目窗口VerifyUserName上,右键选择“新建html文件”,输入文件名称“index”,点击创建按钮。

(5) 在实验资料与素材中找到文件,选中全部复制,并粘贴到项目中,如图6.9所示。

图6.9

(3) 在新建文件下,写入如下基础代码。

效果如图6.10所示。

图6.10

(4) 在实验资料与素材中找到jquery-3.4.1.js文件,选中文件复制,并粘贴到项目中,如图6.11所示。

图6.11

(5) 在页面的<head>标签里面加上jquery的引入代码。

(6) 添加一个加载函数。

代码如下:

(7) 实现一个注册新用户的功能,当输入用户名后自动识别是否已经在数据中注册过,将用户名和文件夹中的json文件的数据对比,如果有名字相同的证明已经注册过了,最终效果如图6.12和图6.13所示。

图6.12

图6.13

新加代码:

至此完成任务1所有要求。