Js中密码框显示提示的方法【代替placeholder】

最新推荐文章于 2022-02-23 20:15:33 发布

原创

最新推荐文章于 2022-02-23 20:15:33 发布 · 364 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端

这篇博客介绍了在JavaScript中如何实现在文本框聚焦时不显示字符，失去焦点后恢复显示的效果，特别是针对type='password'的密码框，由于value值加密，作者通过改变文本框类型来实现类似placeholder的功能。

刚学习JavaScript Dom第三天，准备写一个鼠标焦点在文本框上不显示字符，移开继续显示。但在写 type = password时，value的值以加密的形式展现。同时，placeholder在JavaScript不知道怎么控制（百度很久也没查到具体方法）。

 <input type="text" id="psw" autocomplete="off" value="密码" class="user_text">

  user_psw.onfocus = function

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Maders_M

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

js 简单的密码强度提示

想飞的猪的博客

09-04

1245

<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂蚁部落</tit

XState 在 Vue 3 中的使用方法详解

最新发布

哆啦A梦的百宝袋的博客

10-11

887

XState 在 Vue 3 中的应用指南 XState 是一个强大的状态管理库，通过有限状态机概念帮助管理复杂应用状态。本文介绍了在 Vue 3 项目中使用 XState 的完整流程：环境搭建：通过 npm/yarn 安装 xstate 和 @xstate/vue 依赖核心概念：包括状态机、状态、事件、转换等基本要素基础使用：定义状态机（如开关状态机示例）在组件中使用 useMachine 组合式 API 通过 state 和 send 实现状态管理和事件触发进阶功能：并行状态管理多维度状态

参与评论您还未登录，请先登录后发表或查看评论

easyui combobox中input placeholder的替代方法

cc1314_工作、学习有感

08-29

6886

$('#pib_add_itemno').combobox({prompt:"请输入编号"});

js实现输入框仿html5 placeholder功能

HiNet

07-23

5334

思路是将label定位到输入框上面，根据输入框内容判断显示或者隐藏label，当然如果浏览器支持html5则就使用placeholder功能就ok了，所以可以预先判断一下是否支持。方法很简单，下面代码直接运行可以实现效果。 New Document ul,li{list-style:none;margin:5px 0px;padding:0px;} .la

placeholder兼容性问题以及用label代替placeholder

weixin_30567225的博客

04-24

370

什么是placeholder？答：HTML5中的一个新属性，用于表单元素中，规定可描述输入字段预期值的简短的提示信息，也就是表单元素中的预留文本。适用于下面的 input 类型：text、search、url、tel、email 和 password，还适用于textarea元素。 placeholder有哪些兼容性问题？答：1、placeholder在IE9及以前的浏览器中不...

html密码框效果不出来,JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果...

weixin_39552768的博客

06-03

410

本文实例讲述了JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果。分享给大家供大家参考，具体如下：思路：1、首先用把密码框用txt暂时替代，并赋上默认值 2、当文本框获取焦点后，把默认值清空，把type改为password。3、当文本框失去焦点后，把type改为txt，把默认值设为“请输入密码”。JS代码：window.onload=function(){var input=documen...

html密码框用*代替.

10-01

首先，用户查询是：“我想查找在HTML中使用*代替密码框输入内容的方法。请问HTML中用*代替密码框输入内容的实现方法。” 用户提供了几条引用，我需要参考这些引用来回答问题。关键是实现密码输入时显示星号（*），...

实现密码显示隐藏功能的JavaScript方法

在这个场景中，我们将探讨如何使用JavaScript来实现一个常见的Web功能：显示和隐藏密码。具体来说，我们会创建一个用户界面，其中包含一个密码输入字段，旁边有一个切换按钮，用户可以通过点击按钮来切换密码字段的...

精选资源

蓝色渐变登录框网页模板

01-23

3. **输入框设计**：输入框通常会有边框和内阴影，以突出显示，并使用placeholder文本提示用户输入信息。在这个模板中，输入框可能会有与背景相协调的蓝色边框和高亮效果。 4. **按钮设计**：登录按钮是表单中的...

js自定义密码输入框弹窗

05-29

js自定义密码输入框弹窗的demo，因项目需要所以编写了这个小demo，如有需要同志们可以自行下载直接复制粘贴就行，然后浏览器打开测试。

js正则实现的密码框简单制作,还可以替换成自己想用得符号

10-30

js正则实现的密码框简单制作,还可以替换成自己想用得符号

js实现input密码框显示/隐藏功能

12-04

JavaScript实现input密码框显示/隐藏的功能，供大家参考，具体内容如下实现代码： <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> .password{ position: relative; width: 280px; height: 60px; } .password,.n-txtCss{ display: flex; align-items: center; } .password .fa{ position: absolute; righ

Js制作点击输入框时默认文字消失的效果

10-23

为了提高用户体验和易用度，一些设计师会对网页中用户经常用的东西进行优化，比如输入框。一般的输入框是怎样优化的呢？从用户体验的角度出发，简化用户使用步骤，让用户用得更方便就是提高了易用性

javascript搜索框点击文字消失失焦时文本出现

10-25

主要介绍了javascript实现搜索框点击文字消失失焦时文本出现的效果，示例代码如下，大家可以看看

js实现input密码框提示信息的方法(附html5实现方法)

10-22

主要介绍了js实现input密码框提示信息的方法,涉及JavaScript页面元素的获取,属性判断及样式设置等技巧,并附带html5的相关实现方法,需要的朋友可以参考下

使用JavaScript实现placeholder效果，不使用placeholder。

qq_44722972的博客

04-14

468

使用JavaScript实现placeholder效果主要使用“focus”和“blur”的监听方法，实现了文本框未聚焦时，文本框内为灰色的提示文本，聚焦之后提示文本消失，输入的文字为黑色，若没有输入文字，失焦时文本框内重新显示灰色提示文本。下面先放代码 <!DOCTYPE html> <html lang="en"> <head> <meta...

JavaScript实现输入框(密码框)出现提示语

踢足球的程序员的博客

01-04

2995

JavaScript实现输入框(密码框)出现提示语我们需要在登陆表单有一些提示语言，比如“请输入用户名”和“请输入密码”等语言，至于用户名好说，但是在密码框中出现“请输入密码”这样的语言就有点麻烦了，因为在密码框输入的内容不会以明码显示。如果动态的控制type属性的话就有兼容性问题，如果input已经存在于页面中的话，在IE8和IE8以下浏览器中，type属性是只读的。所以就得想其他办法，代码如下: 以上代码实现了我们的要求，可以出现明码的提示，当输入密码的时候就是以密码方式输入。实现的原理非常的简单

placeholder 和 value 的区别

abcccc1111901的博客

02-23

3413

placeholder 和 value 的区别

在WebView中对第三方H5页面的文本密码框添加自定义随机键盘

比较喜欢、笑的博客专栏

08-15

1502

前言：首先介绍一下这个需求的背景，由于公司是涉及到金融行业的需要与银行对接资金存管。出于保密性这里不直接列出公司名字和银行名字。从2018年国家对金融行业大整改以来，为了能够顺利通过备案，我们也跟着政府的脚步一步一步走向合规。好了，大致就是因为要通过备案，必须把这个需求实现，否则将不会通过。需求内容就是，当客户端有关资金交易的时候，会通过加密数据以及秘钥的方式把第三方银行的页面（充值、...