位置: 编程技术 - 正文

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)

  • 地方税概述?
  • 公司每年网络费计入什么会计科目
  • 税费返还计入什么费用
  • 其他应付款二级明细
  • 分公司可以享受小规模纳税人优惠
  • 出口报关单上的运费和保费和实际不一致
  • 住宿发票抵扣怎么做账
  • 银行承兑个人可以接受吗
  • 少提的税金如何做账
  • 集团内部拨付的研发经费如何核算?
  • 公司造成损失要员工承担吗
  • 拿票报销的交通费要交个人所得税吗
  • 增值税普通发票和普通发票的区别怎么交税
  • 生产型企业增值税率是多少
  • 辞退福利怎么交税
  • 外贸企业出口货物会计账务处理
  • 购进的货物用于赠送
  • 出口退税免退税
  • 2021年windows最新版本
  • 外资公司股东要求
  • system idle process是什么进程(CPU的空闲率)
  • php防止订单重复处理
  • windows怎么复制
  • 固定资产前期购买的后期入账怎么入?
  • hipsdaemon.exe是什么
  • 最薄的索尼微单
  • 外购商誉是资产吗
  • 安个小窝
  • 劳务费发票和建筑劳务费发票
  • 购入商品再卖出
  • 小规模城建税减半征收2021新政策
  • 存货跌价准备是负数表示什么
  • 第二季度所得税怎么算
  • 个税中累计住房怎么计算
  • 未分配利润与净利润关系
  • vue项目中技巧知识点
  • 公司借款给个人怎么写借条
  • html表格用法
  • 食堂员工自己吃饭违法吗
  • 抄税清卡是一个意思吗
  • 应计入财务费用的科目是
  • 游戏公司的主营业务是什么
  • 在pycharm中配置python
  • 预收货款尚未发货
  • 研发支出可以计提吗
  • 织梦自定义字段
  • mysql默认存储引擎的命令
  • sql server 2008 R2安装
  • 增值税发票怎么领取
  • sql server 2012安装无网络可以OK?
  • 小企业期间费用包括
  • mysql查询字段为空的数据
  • 开发研究的定义
  • 纳税检查企业多缴企业所得税如何处理
  • 事业单位结余是什么意思
  • 公司买汽车计入什么费用
  • 公司转让二手车需要缴纳什么税
  • 毛利和净利的区别大白话
  • 建总账的注意事项
  • 建账的过程包括哪些内容
  • win10预览版和正式版区别
  • linux命令sed -i
  • unix系统采用什么结构
  • Linux系统root密码忘记怎么重置
  • seti@home.exe - seti@home是什么进程 有什么用
  • 解决linux下set_loginuid failed opening loginuid报错问题
  • win10下载英雄联盟运行没反应
  • win7系统电脑无限重启
  • cocos2d android 游戏开发学习——CCAction(二)
  • jquery实现搜索功能
  • 用python的turtle画图代码
  • Node.js中的什么模块是用于处理文件和目录的
  • nodejsorg
  • 批处理转义字符如何
  • linux常用shell操作指令
  • 沧州地税局领导班子
  • 晋城兰花集团招聘
  • 税务局六大攻坚
  • 深圳如何打印个人征信
  • 江苏省国税局局长
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设