HTML里怎么设置密码框为星号,input密码框输入后设置显示为星号或其他样式

于 2021-06-27 00:49:38 发布
阅读量4.9k 收藏
点赞数 1
文章标签： HTML里怎么设置密码框为星号
在HTML中设置密码框为星号显示，可以通过监听输入事件动态更新显示内容。当输入密码时，可以使用正则匹配移除汉字并显示星号。同时，可以实现输入手机号码时自动分隔，以及禁止input文本框回车提交等操作。
摘要由CSDN通过智能技术生成

预览效果

L3Byb3h5L2h0dHAvenVvYmFpcXVhbi5jb20vYmxvZ0ltZy8yMDE4MTEvaW5wdXRzdGFyLmdpZg==.jpg

核心代码

{ {"*".repeat(text.length)}}

:type="type=='number'?'tel':'text'"

ref="inputText"

:style="[star?'':{paddingLeft:'5px'},right?{textAlign:'right'}:'']"

:class="['text',className]"

v-model="value"

@keyup="handelKeyup"

:placeholder="text?'':placeholder"

:maxlength="maxlength" />

watch: {

value(val) {

if(this.star && val

最低0.47元/天 解锁文章
weixin_39709178
关注
input密码框输入后设置显示为星号或其他样式
weixin_30772105的博客
11-27 7144
预览效果 核心代码 <div class="text-input" :class="right?'textinput-right':''"> <span :style="right?{paddingRight:'5px'}:{paddingLeft:'5px'}" v-if="star">{{"*".repeat(text.length)}}</...
[html] 写一个密码默认星号，但可以查看密码的输入框
歌谣的博客
03-22 974
[html] 写一个密码默认星号，但可以查看密码的输入框 <i class="icon-password"></i> <input type="text" v-if="pwdType" v-model="eyeTxt" /> <input type="password" placeholder="输入新密码" v-model="eyeTxt" v-else /> <img :src="seen ? seenImg : unseenImg" @click
让输入的密码以星号的样式显示
weixin_33953384的博客
02-22 1985
<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=d...
html input密码显示为“*”
热门推荐
happy59的专栏
08-12 1万+
*{margin:0;padding:0} input{font:14px Monospace;height:20px;width:160px;} label{display:inline-block;width:100px;height:20px;} #pass{position:absolute;left:100px;top:0;opacity:0;filter:alpha(opacit
输入密码以星号显示
Sfeng177的博客
11-09 1605
#include        #include        #include       #include         #include     #include           char Getch()       {         int c = 0;           int res = 0;             struct termios org
html密码框字数限制,html input密码显示为“*”
weixin_39615984的博客
05-30 1040
1. 功能需求：HTML中,在input password输入框中输入字符将默认显示为“实体圆点”，但这里要求将实体圆点字符替换成“*”号显示。2. 局限：鼠标光标非IE浏览器不一定显示，选择多个字符时未有视觉上的区分，功能没有影响；不支持中文输入。3. 实现：通过两个input框实现，设置字符字体为等宽字体；其中真正的密码输入框设置为透明且遮盖住另一输入框，将非密码输入框的字符依密码字符串的多少...
input输入后显示为星号或其他样式
06-07
您可以使用CSS样式来实现输入后显示为星号或其他样式的效果。具体做法是，使用CSS的伪元素`::placeholder`和`:-ms-input-placeholder`、`::-ms-input-placeholder`来设置输入框的占位符文本样式。 以下是一个简单的...
input type=text输入后显示为星号或其他样式
最新发布
06-07
如果您使用的是`<input type="text">`标签，而不是`<input type="password">`标签，那么您需要使用JavaScript来实现输入后显示为星号或其他样式的效果。 具体做法是，使用JavaScript监听输入框的`input`事件，在...
Shell脚本中实现把输入的密码转换为*（星号）的方法
01-10
用户密码、License等），那么直接用printf+read的方式，就会把用户输入的信息显示在屏幕了，这是不符合信息安全的，而且对客户体验来说也显得不够专业，所以就需要将用户输入的密码转换为*，样式如下： please input...
Html —— 密码输入框输入后显示为点
看了就会暴富的博客！
10-21 5601
问题 在输入密码时，为了防止被其他人看到，要将其显示成“.”，如何实现？ 解决 将input的类型设置为password即可。 <div class="a-b"><input class="a-b-c" type="password" placeholder="请输入密码"></div> 效果 ...
让输入的密码不在显示（或者显示为星号）
11-13
我们可能在使用Linux的是看到当登录用户输入密码的时候，密码不被显示。在其他的情况，那就是密码为星号，我们应该怎么实现呢？ 上面是我借鉴“http://download.csdn.net/detail/wm542971618/4004885#comment”的例子，写的一个函数，希望对大家有帮助！ ------免费共享资源，共创和谐编程环境------
在html前端页面中密码输入框，输入一个字符显示明文，过一秒后再变*号的效果如何用js实现
12-10
在html前端页面中密码输入框，输入一个字符显示明文，过一秒后再变*号的效果如何用js实现
vue+element 将密码输入框的小圆点显示为星号
weixin_50606255的博客
04-29 6779
首先将输入框的type设置为text,设置为password就只能显示为小圆点 <el-form ref="form" :model="form" :rules="loginRules" label-width="0px" class="loginForm" > <el-form-item prop="phone"> <el-input v-model="form.phone" placeholder="请输入账...
html语言星号,DIV+CSS 星号*
weixin_39754915的博客
05-31 2347
常常我们在DIV+CSS布局的时候会遇到2处使用星号“*”,一个为以星号*没有命名名称的CSS选择器；另外一个是在CSS选择器里以*开头的CSS属性单词样式-CSS星号-CSS *知识介绍。接下来DIVCSS5为大家讲解这两处星号的区别与用法1、CSS星号*选择器 - TOP新手常常在css+div布局的时候看见CSS代码中第一行有个带“*”星号的选择器。如：*{padding:0; ....
html中红色星号,使用CSS中的星号(*)通配符的总结
weixin_42510604的博客
06-09 3204
本文介绍谨慎使用CSS中的星号(*)通配符的总结在关于CSS3的文章中都提到了通配符的使用(如果你对CSS3中的选择符使用感兴趣可以参考我翻译的详解CSS3中的属性选择符)。里面讲到了CSS3中多种通过符的使用方法，如星号(*)、脱字符(^)和美元符号($)等。而由于星号(*)在CSS2.x中已经得到多数浏览器的支持，所以其使用范围最广。我们最常见的星号(*)使用方法就是：代码如下:* {padd...
html input密码显示为*号
农码精神
04-12 2453
html input密码显示为*号 &lt;!DOCTYPE html&gt; &lt;html encoding="utf-8"&gt; &lt;head&gt; &lt;style&gt; *{margin:0;padding:0} input{font:14px Monospace;h...
html 输入框部分带星_HTML5基础，第2部分，组织输入
cuyi7076的博客
06-24 155
存档日期：2019年5月13日 | 首次发布：2011年5月31日 HTML5反映了您现在在Web和云中开展业务的方式所发生的巨大变化。 本文是由四部分组成的系列文章的第二部分，该系列文章旨在突出HTML5的变化，从新的标记和页面组织开始，并提供有关网页设计的高级信息。 表格的创建； API的用途和价值； 最后，是Canvas提供的创新可能性。 第二部分介绍HTML5表单控件的概念，并介绍...
html语言星号,如何使HTML代码，输入的东西星号显示出来
weixin_33788465的博客
05-31 1792
满意答案xrjiangxb2013.05.25采纳率：51%等级：11已帮助：14059人这样就行了：var pass=new Array()var t3=""var lim=4pass[0]="4iI5zr171aFJXF0"pass[1]="nFRvwiOGlkKypL7"pass[2]="xc1v65UsGiYpSo3"pass[3]="QQYYGw5TJfmeA"pass[4]="...
html密码域的type属性,查看网页黑点密码 将type="password"中password修改成为text
weixin_29798379的博客
06-05 5872
将type="password"中的password修改成为text修改完成后点击回车查看网页黑点密码，这个功能很好用哦用了这招，将小黑点变成直接显示密码！忘记密码也能立刻想起来了操 作 步 骤步骤一、全选密码后，右键点击检查步骤二、将type="password"中的password修改成为text修改完成后点击回车步骤三、这样之前是黑点的密码，会直接显示出来这么一想，记住密码这个功能有非常大的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值