💎一站式轻松地调用各大LLM模型接口,支持GPT4、智谱、星火、月之暗面及文生图 广告
从网上下载了两个登录注册页面,我自己再修改一下,写了一下js脚本代码,主要是判断用户名是否为空。 注册页面html代码:![](https://box.kancloud.cn/4ab615885dd23888e836a34bd7f1081c_1129x795.png) 登录页面html代码: ![](https://box.kancloud.cn/f12d301ad1b3169e54df0c8be4d0077a_1075x703.png) 模板目录结构: ![](https://box.kancloud.cn/8cfde8c40952b3df2223f445c5a24ff1_220x437.png) css布局并没有太大变动,只是改了一些颜色添加<p>标签而已: 注册页面的css布局 ![](https://box.kancloud.cn/53c2aa2eacc3d341e567858ec9ea2149_1121x759.png) ![](https://box.kancloud.cn/ad59e654986369987adca2e88b5fc07c_321x632.png) ![](https://box.kancloud.cn/03277869b125b42567ce6092991caa74_290x710.png) 注册页面的js代码: ![](https://box.kancloud.cn/f5f7315ccd894a075c71aa9df1dafe93_692x574.png) 登录页面的js代码: ![](https://box.kancloud.cn/26fdfe5f83f8c674f5645363c8172d7f_575x288.png) 测试效果: ![](https://box.kancloud.cn/1ae2e17bd3742d5cff9d6fea91ff8423_398x478.png) 其中涉及的一些技术和方法,对于一些不太明白的我都百度了一下: onblur事件 ![](https://box.kancloud.cn/0c106e197e4c52444e09fa844ec9cc18_838x472.png) ![](https://box.kancloud.cn/52ccf36bac23eba225e620a9dee480d8_833x148.png) value属性 ![](https://box.kancloud.cn/37bb21293dbffa58aee2f6142fa14e93_827x671.png) innerHTML属性 ![](https://box.kancloud.cn/db5d5576b93acc54c2f67214bd4b5817_831x236.png) getElementById()方法 ![](https://box.kancloud.cn/34fb22c0b802058f1f25260876b18cde_834x687.png) 数据库操作 ![](https://box.kancloud.cn/a867eaf2a0175811784b32981c292f6a_426x288.png) ajax请求方式 ![](https://box.kancloud.cn/4220b483199ff7a9a552b1f35cce3d29_659x872.png) encodeURIComponent函数 ![](https://box.kancloud.cn/ec857f167a3ab099c7295d4d7ab6d1e1_821x788.png) border-radius属性 ![](https://box.kancloud.cn/abcd959860ecea676ebb01062724a7f4_824x233.png) 还有一些我没有百度,因为我大概能猜到其作用就没有去详细了解了。