前端开发隐藏/显示密码的Zepto

网易web前端开发流程
前端网络开发流程
前端开发中支付开发流程图

html 代码

<!DOCTYPE html>
<html lang=”en”>
    <head>
        <meta charset=”UTF-8″ />
        <title>Document</title>
        <script
            type=”text/javascript”
            src=”http://www.xipwang.cn/js/zepto.min.js
        ></script>
    </head>
    <body>
        <div class=”ui-password”>
            <input type=”password” name=”” class=”passwords” />
            <button class=”seepassword”>查看密码</button>
        </div>
        <script type=”text/javascript”>
            $(function () {
                (function () {
                    $.fn.showpassWord = function () { //查看密码
                        function Seepasswrod(elemnts) {
                            this.elemnts = elemnts;
                            this.init();
                        };
                        Seepasswrod.prototype = {< br />
                            init: function () {
                                var m = this < br />
                                    this.shouEvent(m);
                            },
                        shouEvent: function (m) {
                            m.elemnts.on(“tap click”, function () {
                                var type = m.elemnts.parent().find(“.passwords”).attr(“type”);
                                if (type == “password”) {
                                    m.elemnts.parent().find(“.passwords”).attr(“type”, “text”);
                                } else if (type == “text”) {
                                    m.elemnts.parent().find(“.passwords”).attr(“type”, “password”);
                                }
                            });
                        },
                    };
                    return this.each(function () {
                        new Seepasswrod($(this)) < br />
             });
                };
            })(Zepto);
            $(“.seepassword”).showpassWord();
             });
        </script>
    </body>
</html>
前端开发工程流程图
前端开发基本流程
一般大公司前端开发流程
» 本文来自:前端开发者 » 《前端开发隐藏/显示密码的Zepto》
» 本文链接地址:https://www.rokub.com/7077.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!