javascript - 在不影响占位符的情况下增加密码输入字符大小

Question

是否可以在不影响占位符的情况下增加 HTML 密码输入的字体大小？换句话说，我想扩大密码符号(元素符号)的大小。

当然，我尝试增加 input[type="password"] 的 font-size。这非常有效，但它也使我的占位符字体增加:

是否有解决方法来防止我的占位符受到影响？我知道您可以使用 ::-webkit-input-placeholder 或 :-moz-placeholder 专门针对它们 - 但这在全局范围内应用并且基本上违背了我的目的问题。

欢迎使用任何 HTML、CSS 或 Javascript/jQuery 解决方案。

Answer 1

我没有找到您问题的准确解决方案。但是我用一些 javascript/jquery 代码来解决你的问题。

HTML

 <input id="txtInput" type="password" placeholder="Passowrd" onchange="CheckModification();" onpaste="this.onchange();" oninput="this.onchange();"/>

Jquery

$(document).ready(function(){
    $('#txtInput').focus(function () {
        if ($('#txtInput').val() == "") {
             $('#txtInput').css('font-size', '14px');
         }
         else {
             $('#txtInput').css('font-size', '24px');
         }
     });

     $('#txtInput').blur(function () {
         if ($('#txtInput').val() == "") {
             $('#txtInput').css('font-size', '14px');
         }
         else {
             $('#txtInput').css('font-size', '24px');
         }
     });
 });

function CheckModification(){
         if ($('#txtInput').val() == "") {
             $('#txtInput').css('font-size', '14px');
         }
         else {
             $('#txtInput').css('font-size', '24px');
         }
     }

Try This

希望对你有所帮助。