直接让用户自行根据需要选择是全部隐藏输入的密码,还是全部显示输入的密码。

在全部显示密码框的内容时,用户输错的可能性就大大降低,这也是微软推荐的一种密码框处理方式。效果如下:

今天,我将给大家介绍,在WordPress中如何实现这个的功能,步骤非常简单。

1、添加js

点此下载 需要用到的js,将此js文件放到当前使用主题的根目录下。

2、添加php代码

function ludou_prevue() {
wp_enqueue_script("jquery");
wp_enqueue_script( 'prevue', get_template_directory_uri() . '/jquery.prevue.min.js', array(), '1.0', true );
?>
<style type="text/css">
.prevue-icon-eye:before { content: "\f177"; }
.prevue-icon-eye-off:before { content: "\f160"; }
</style>
<?php
}
add_action( 'login_enqueue_scripts', 'ludou_prevue' );
?>

好了,大功造成!

补充说明

1、如果你要将js文件放在当前主题的js目录,那你需要将php代码第3行中的 /jquery.prevue.min.js 改成 /js/jquery.prevue.min.js
2、此功能需要1.9.0以上版本的jQuery支持。

此功能用到了以下jQuery插件:Prevue.js

-- 完 --

本文采用 「CC BY-NC-SA 4.0」创作共享协议,转载请标注以下信息:
原文出处:露兜博客 https://www.ludou.org/wordpress-login-form-show-hide-password.html

WordPress登录框显示/隐藏输入的密码的更多相关文章

  1. jquery 实现 <imput>标签 密码框显示/隐藏密码功能

    1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 < ...

  2. checkbox:click事件触发文本框显示隐藏

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 【Android初级】教你用两行代码实现“显示/隐藏密码”的效果

    Android里面要使用密码的场景是非常多的,支付宝.微信.淘宝以及各大银行APP,都跟用户的密码有关.用户的密码是极为隐私的,用户在输入时不希望密码被别人看到,所以几乎所有需要输入密码的场景下都会把 ...

  4. wordpress登录密码框明文显示最后一个输入的字符

    wordpress登录密码框明文显示最后一个输入的字符 (function(a){a.fn.dPassword=function(c){var e={interval:200,duration:100 ...

  5. EditTextPreference点击后输入框显示隐藏内容,类似密码输入(转)

    http://bbs.anzhuo.cn/thread-928131-1-1.html EditTextPreference点击后输入框显示隐藏内容,类似密码输入... [复制链接]     aski ...

  6. JS控制文本框中的密码显示/隐藏功能

    <html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <s ...

  7. Android学习笔记之打钩显示输入的密码

    利用EditText作为密码输入框是个不错的选择(只需设置输入类型为textPassword即可),保密且无需担心被盗取.但有时用户也不知道自己输入的是否正确,这时就应该提供一个“显示密码”的复选框, ...

  8. iview 怎样屏蔽掉账户框自动显示账户名和密码(root,***)

    用iview框架做出的登录页面,账户名和密码显示框,会自动有占位信息(root,****) 后来解决问题发现,只要在真正的输入框下面添加这样的一行隐藏的代码,占位信息会自动填充到隐藏的input框内, ...

  9. JS组件系列——显示隐藏密码切换的jQuery插件

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

随机推荐

  1. Java 实现Excel表数据的读取和写入 以及过程中可能遇到的问题

    问题1:Unable to recognize OLE stream 格式的问题要可能是因为给的数据是2010年的数据表后缀为.xlsx,要先转化成2003版的后缀为.xls 问题2: Warning ...

  2. 前端常用的jquery代码

    主要是个人在工作中常用到的一些代码,会慢慢添加: 1).enter键时可以触发某些事件,比如登陆事件: $('#loginform').bind('keypress',function(event){ ...

  3. Android 面试总结~~~

    一.面试中的问题 通过这几天的面试,总结了自己在面试过程中问到的问题,部分问题已经给出了答案,还有部分问题,还未有时间整理出来. ListView出现闪图.图片错乱原因解决方案 函数式编程 (Lamb ...

  4. EJB2.0教程 详解EJB技术及实现原理

    EJB是什么呢?EJB是一个J2EE体系中的组件.再简单的说它是一个能够远程调用的javaBean.它同普通的javaBean有两点不同.第一点,就是远程调用.第二点,就是事务的功能,我们在EJB中声 ...

  5. LibreOJ #103. 子串查找

    题目描述 这是一道模板题. 给定一个字符串 A AA 和一个字符串 B BB,求 B BB 在 A AA 中的出现次数. A AA 中不同位置出现的 B BB 可重叠. 输入格式 输入共两行,分别是字 ...

  6. search bar 自定义背景

    //修改搜索框背景 self.searchCarKeyWord.backgroundColor=[UIColorclearColor]; //去掉搜索框背景 //1. [[self.searchCar ...

  7. Django auth权限

    创建超级管理员命令 python manage.py createsuperuser --username hello 检查和校验用户 from django.contrib import auth ...

  8. Kubernetes介绍与特性

    1.Kubernetes 是什么 简单的来说,k8s可以理解为,一个容器平台,一个微服务平台,便携式云平台,我们那可以很快速的搭建一个服务,快速的运行起来 2.Kubernetes特性

  9. java运行环境jdk的安装和环境变量的配置教程

    jdk的下载与安装 一.官网下载jdk 1.百度搜索jdk,进入官网,如下图所示: 官网下载jdk图1 2.在官网网站中找到合适的版本下载(以最新版本为例),如下图所示: 官网下载jdk图2 官网下载 ...

  10. HTML5<picture>元素

    HTML5<picture>元素可以设置多张图片 <!DOCTYPE html><html><head><meta http-equiv=&quo ...