位置: 编程技术 - 正文

JS模仿手机端九宫格登录功能实现代码(js手机模拟器)

编辑:rootadmin

推荐整理分享JS模仿手机端九宫格登录功能实现代码(js手机模拟器),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:js模拟登录网站,js手机版,js模拟用户操作,js 模拟new,js手机模拟器,js模拟登录网站,js手机模拟器,js 模拟new,内容如对您有帮助,希望把文章链接给更多的朋友!

最近没有项目做,闲来无事写了一个小demo,特此分享到积木网平台,供大家参考下,本文写的不好还请各位大侠见谅!

 功能及方法逻辑都注释在代码中。所以麻烦大家直接看代码。

 效果如下:

 话不多说直接上代码:

 js部分:

 首先我们先画出两个九宫格,一个用于登录和首次设置滑动密码使用,另个用于再次设置滑动密码,用于与第一次输入的滑动密码进行对比,判断两次密码是否一致

 第一个九宫格

JS模仿手机端九宫格登录功能实现代码(js手机模拟器)

在用同样的方式画出第二个九宫格

html部分:

用户登录时通过业务逻辑层查询数据库,看客户是否设置九宫格密码,如果设置则调用add()方法,未设置则调用upup()方法。

当用户已经设置过时我们进行如下操作(调用add()方法):

这里我们可以获取客户在九宫格滑动的密码,将之取出来(即 passwd),我们将之与隐藏元素pass中的密码对比,如果一样这进入下一步,即登录成功。因为是dome所有密码我直接放在页面的元素中,在实际开发中不建议这样,最好在后台进行对比,如果要这样请加密之后操作。如果用户为第一次设置的话,我们调用upup方法

这里我们获取到用户第一次滑动设置的密码将之赋给pass元素中。

然后调用Recursive方法

  我们将第二次设置的密码与第一次对比,如果一样我们就通过ajax将密码传到后台,进行密码保存操作。如果两次输入不一样我们就通过递归在将自己在调用一次进行对比,直至通过,当然你也可以设置3次不同重新设置什么的。

  由于功能很简单就不进行详解,如果有不明白或者要参考源码的请留言,我会编写一个dome与大家分享。

JavaScript Math 对象常用方法总结 Math.abs(x):可返回数的绝对值Math.ceil(x):向上取整Math.floor(x):向下取整Math.max(x,y):最大值Math.min(x,y):最小值Math.random(x):随机数Math.round(x):四舍五入获取指定范

JavaScript String 对象常用方法总结 字符串是不可变的。字符串方法,不会改变原有字符串的内容,而是返回一个新字符串。charAt():返回在指定位置的字符。concat():连接两个字符串文本

onclick和onblur冲突问题的快速解决方法 新浪首页的搜索框里面有一个使用ajax的下拉框。我们需要实现一个点击下拉框里面的一项,让搜索框里面的值变成这一项,同时下拉框消失的效果,但

标签: js手机模拟器

本文链接地址:https://www.jiuchutong.com/biancheng/369900.html 转载请保留说明!

上一篇:Bootstrap Chart组件使用教程(bootstrap 图表插件)

下一篇:onclick和onblur冲突问题的快速解决方法(onclick和onclientclick)

  • 电子税务局附加税带不出来
  • 记账王怎么查询凭证
  • 代收的电费计入什么费用
  • 如何开增值税专用发票视频
  • 公司资料更新
  • 股权转让需要开董事会吗
  • 免费赠送货物出租合同
  • 国有资产转让房产
  • 购买的二手车可以抵扣进项税额吗
  • 增值税计算方式举例
  • 代缴税款是什么意思
  • 捐赠出的资产如何处理
  • 按季度报税怎么处理
  • 增值税怎么勾选
  • 折价退回的会计处理
  • 邮局劳务费发票几个点
  • 长期股权投资佣金手续费计入
  • 代收污水处理费要交税吗
  • 法人变更后的涉税问题
  • 在国外餐厅吃饭服务费和税费
  • 金蝶旗舰版反过账的操作步骤
  • 管理费用企业所得税标准
  • 预收账款预提费用是什么
  • 劳务费和合同如何分配
  • 资产负债表中的固定资产怎么算
  • php变量设置
  • win10电脑记事本打不开显示错误
  • 土地增值税内控报告
  • mac怎么写代码
  • 房产开发企业交房产税吗
  • 酒店没有营业执照可以举报吗?
  • 增值税一般纳税人认定标准
  • nvm安装及全局配置node
  • zendstudio怎么创建php项目
  • matlab绘图总结
  • 大西洋,一望无际的海面
  • thinkphp+vue
  • 个税中累计住房怎么计算
  • 残保金漏报如何处理
  • 补提所得税费用可以直接计入当期
  • 体验了一回
  • web系统的安全现状
  • 自然人税收管理系统
  • html+css网页设计
  • 进项税大于销项税怎么结转
  • 一般纳税人无票收入怎么报增值税
  • python中@是什么意思
  • 织梦专题页模板
  • php安装不上
  • 外经证开错作废要带些什么
  • 个人所得税退税退多少钱怎么算
  • 如何查询金税盘发票金额及开票数量
  • 城建税小规模纳税人
  • 无偿调入的固定资产怎么记账
  • 可供出售金融资产新准则叫什么
  • 一般纳税人已交税金账务处理
  • 生产企业购进的生产原材料用来装修公司会计处理
  • 出口收汇核销单是什么意思
  • 支票存根联可以涂改吗
  • 承兑汇票贴现计算器下载
  • 暂估成本以后也没有票回来了
  • 施工图审查费属于什么费
  • 进项发票可以退税吗
  • 开票操作流程是什么
  • 员工的车是否可以抵税
  • 留抵税额可以抵欠税吗
  • 运维zabbix
  • 日历显示不全
  • cocos2djs
  • Python插件怎么安装
  • javascript例题
  • 序列化为json
  • node.js中的http.request.end方法使用说明
  • 怎么检测python
  • android设计模式的应用场景
  • python 数据类型
  • 土地闲置是否需要缴纳土地使用税
  • 全国残疾人工作先进个人
  • 发票打印机设备设置
  • 徐州市哪些区域封闭了
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设