一秒面掩码js部分

最新推荐文章于 2023-06-29 17:09:21 发布

天涯T_T浪人

最新推荐文章于 2023-06-29 17:09:21 发布

阅读量189

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/weixin_44022586/article/details/102506548

版权

vue 专栏收录该内容

24 篇文章 0 订阅

订阅专栏

            // 一键删除显示隐藏
            _this.$refs.forko.style.display = $("#passwordo").val() != "" ? 'block' : 'none' ;
            _this.$refs.icon.style.display = $("#passwordo").val() != "" ? 'block' : 'none' ;
        },
        // 第二个一秒变掩码
        confirmmethod: function () {
            $("#passwordt").focus()
            var _this = this
            // 正则验证
            var confirmcontent = $("#passwordt").val()
            _this.confirmcontent = confirmcontent.replace(/[\u4e00-\u9fa5]/gi, '')
            var val_l = _this.vall.length;
            var l = _this.confirmcontent.length;
            if (val_l < l) {
                _this.addt = false
                // 新内容
                var newfont = _this.confirmcontent.substr(val_l)
                _this.vall = _this.vall.concat(newfont.split(""))
            } else if (val_l > l) {
                _this.addt = true
                _this.vall.splice(val_l - 1, 1);
            }
            _this.finaVall = _this.vall.join('')
            var flen = _this.finaVall.length
            //定时器没执行过清除定时器
            if (_this.flagl) {
                _this.strl = ''
                if (!_this.passkeyt) {
                    clearTimeout(_this.passtimert)
                    if (l == 1) {
                        _this.strl += _this.finaVall.charAt(flen - 1)
                    } else {
                        for (var i = 0; i < flen - 1; i++) {
                            _this.strl += '•'
                        }
                        _this.strl += _this.finaVall.charAt(flen - 1)
                    }
                    // $("#passwordt").val(strl)
                    _this.passkeyt = false
                    _this.confirmcontent = _this.strl
                } else {
                    _this.passkeyt = false
                }
                if (!_this.addt) {
                    _this.passtimert = setTimeout(function () {
                        var that = _this
                        that.strl = ''
                        for (var i = 0; i < l; i++) {
                            that.strl += '•'
                        }
                        that.maskshowl = that.strl
                        if (that.flagl == true) {
                            that.confirmcontent = that.maskshowl
                        }
                        _this.passkeyt = true
                    }, 1000)
                } else {
                    var that = _this
                    that.str = ''
                    for (var i = 0; i < flen; i++) {
                        that.str += '•'
                    }
                    that.maskshowl = that.strl
                    _this.passkeyt = true
                }
            } else {
                _this.strl = ''
                for (var i = 0; i < flen; i++) {
                    _this.strl += '•'
                }
                _this.maskshowl = _this.strl
                _this.confirmcontent = _this.vall.join("")
            }

            // 一键删除显示隐藏
            this.$refs.forkt.style.display=$("#passwordt").val() != "" ? 'block' : 'none';
            this.$refs.icont.style.display=$("#passwordt").val() != "" ? 'block' : 'none';
        },
        // 一键清除内容  清除定时器
        forkomethod: function () {
            clearTimeout(this.passtimer)
            this.newcontent=""
            this.val = []
            this.finaVal = ''
            this.maskshow = ""
            this.str = ""
        },
        forktmethod: function () {
            clearTimeout(this.passtimert)
            this.confirmcontent=""
            this.vall = []
            this.finaVall = ''
            this.maskshowl = ""
            this.strl = ""
        },
        // 下一步提交
        next: function () {
            if ($("#passwordo").val() != "" && $("#passwordt") != "") {
                var valn = this.finaVal
                var valr = this.finaVall
                if (/\d/g.test(valn) && /[a-z]/gi.test(valn) && /\d/g.test(valr) && /[a-z]/gi.test(valr)) {
                    console.log(1111)
                    if (valn.length >= 8 && valn.length <= 16 && valr.length >= 8 && valr.length <= 16 && valn == valr) {
                        // 符合规则
                        this.getData(this.finaVal)
                    } else {
                        if (valn != valr) {
                            var modal = new Toast({
                                id: "my-id",
                                text: "两次密码输入不一致",//必填
                            })
                        } else {
                            var modal = new Toast({
                                id: "my-id",
                                text: "密码不符合规则",//必填
                            })
                        }
                    }
                } else {
                    var modal = new Toast({
                        id: "my-id",
                        text: "密码不符合规则",//必填
                    })
                }
                // 密码不一致
                if (valn != valr) {
                    var modal = new Toast({
                        id: "my-id",
                        text: "两次密码输入不一致",//必填
                    })
                }
            }
        },
        // 获取url参数函数
        getUrlParameter: function (paramName) {
            var reg = new RegExp("(^|&)" + paramName + "=([^&]*)(&|$)", "i"),
                arr = window.location.search.substr(1).match(reg);
            if (arr) {
                return arr[2];
            }
            return null;
        },
        // 封装请求函数
        getData: function (password) {
            var _this = this;
            var url = "/reqxml?action=40070&path=/qqt/mc/qqt_public_api&funcId=790020&rsttoken=" + this.passtoken + "&password=" + password;
            ajax.run(url, "", function (oData) {
                base.log(oData);
                var data = JSON.parse(oData.BINDATA)
                if (data.code == 0) {
                    // 下一步变暗
                    _this.nextligh = false
                    var modal = new Toast({
                        id: "my-id",
                        text: "设置成功"//必填
                    })
                    setTimeout(function () {
                        base.href('http://action:3413');
                    }, 2000);
                } else {
                    var modal = new Toast({
                        id: "my-id",
                        text: data.msg,//必填
                    })
                }
            });
        },
        // 第一个输入框控制光标只能在最后一位
        lastlinko: function (item) {
            $("#passwordo").focus()
            var oTxt1 = document.getElementById("passwordo")
            oTxt1.selectionStart = oTxt1.value.length
            oTxt1.selectionEnd = oTxt1.value.length
        },
        // 第二个
        lastlinkt: function () {
            $("#passwordt").focus()
            var oTxt1 = document.getElementById("passwordt")
            oTxt1.selectionStart = oTxt1.value.length
            oTxt1.selectionEnd = oTxt1.value.length
        },
    },
    watch: {
        // 第一个输入框控制确认高亮显示
        newcontent: function () {
            if ($("#passwordo").val() != "" && $("#passwordt").val() != "") {
                this.nextlight = true
            } else {
                this.nextlight = false
            }

        },
        // 第二个输入框控制确认高亮显示
        confirmcontent: function () {
            if ($("#passwordo").val() != "" && $("#passwordt").val() != "") {
                this.nextlight = true
            } else {
                this.nextlight = false
            }
        }
    },
    filters: {

    }
});


// 获取焦点
$("#passwordo").on("focus", function () {
    if ($("#passwordo").val()) {
        $(".forkinnero").show()
    }
})
$("#passwordt").on("focus", function () {
    if ($("#passwordt").val()) {
        $(".forkinnert").show()
    }
})
// 失去焦点 一键删除隐藏
$("#passwordo").on("blur", function () {
    $(".forkinnero").hide()
})
$("#passwordt").on("blur", function () {
    $(".forkinnert").hide()
})

});

在input输入框上面覆盖div,添加点击事件获取焦点，阻止获取中间光标，input只能在最后以后添加内容，查询获取光标边界。

天涯T_T浪人

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
一秒面掩码js部分

var vm = new Vue({el: “#fix”,data: {val: [],finaVal: ‘’,// 输入框显示值maskshow: “”,// 判断是否掩码显示flag: true,str: “”,// 存放真实值vall: [],// 最终值finaVall: ‘’,maskshowl: “”,flagl: true,strl: “”,// 第...
复制链接

扫一扫

专栏目录