设置默认值

我想拥有它说“密码”中有一个用户之前输入密码字段中输入自己的密码（让他们知道现场是什么）设置默认值

我d而只是使用Javascript，单独导入jQuery看起来很浪费，但我不知道如何去做。这些图像解释很清楚：

它看起来像什么：

enter image description here

我希望它看起来像：

enter image description here

这只是一个很简单的网站和最基本的登录（没有验证等）

任何想法？

<input id="username" name="username" class="input_text" type="text" value="Username" /> 
<input id="password" name="password" class="input_text" type="password" value="Password" />

来源

2011-01-25 theorise

你可以通过动态更改字段的类型（即第一个“文本”，在激活时更改为“密码”）来破解它。我不是100％肯定这会起作用。 – 2011-01-25 18:07:28

更改password输入是一个简单的输入型text。然后，在焦点事件上使用JavaScript（或JQuery），将其更改为输入类型password。

这里是一个小未测试样本的与普通的JavaScript（无JQUERY）：

<html> 
<head> 
    <script type="text/javascript"> 
     function makeItPassword() 
     { 
     document.getElementById("passcontainer") 
      .innerHTML = "<input id=\"password\" name=\"password\" type=\"password\"/>"; 
     document.getElementById("password").focus(); 
     } 
    </script> 
</head> 
<body> 
    <form> 
     <span id="passcontainer"> 
     <input onfocus="return makeItPassword()" name="password" type="text" value="Type Password" /> 
     </span> 
    </form> 
</body> 
</html>

来源

2011-01-25 18:08:52

+1。我就是这么做的。 `（“＃password”）。bind（“focus”，function（）{$（this）.val（“”）; $（this）.attr（“type”，“password”）;}）;` – 2011-01-25 18:12:36

请注意，更改`input`元素的`type`在IE上将无法正常工作。另见：http://stackoverflow.com/questions/1544317/ – CMS 2011-01-25 18:15:43

一个简单的办法：

<input id="username" name="username" class="input_text" type="text" placeholder="Username" /> 
<input id="password" name="password" class="input_text" type="password" placeholder="Password" />

来源

2011-01-25 19:29:44 Ms2ger

如果您使用HTML5，那么你应该使用placeholder attribute。

<input id="username" name="username" class="input_text" type="text" placeholder="Username" /> 
<input id="password" name="password" class="input_text" type="password" placeholder="Password" />

如果你使用的HTML4，您可以创建一个fake password field。

<script type="text/javascript"> 
    function pwdFocus() { 
     $('#fakepassword').hide(); 
     $('#password').show(); 
     $('#password').focus(); 
    } 

    function pwdBlur() { 
     if ($('#password').attr('value') == '') { 
      $('#password').hide(); 
      $('#fakepassword').show(); 
     } 
    } 
</script> 

<input id="username" name="username" class="input_text" type="text" v="Username" /> 
<input id="fakepassword" name="fakepassword" type="text" value="Password" style="color:#ccc" onfocus="pwdFocus()" /> 
<input id="password" name="password" class="input_text" type="password" style="display:none" onblur="pwdBlur()" />

来源

2011-04-26 21:30:46

-2

我还有另外一个想法来处理这个问题，你将不再需要使用Javascript：

<input onclick="value=''; type='password';" name="password" type="text" value="Password" />

或者你也可以做这样的：

<input onclick="this.value=''; this.type='password';" name="password" type="text" value="Password" />

我不知道这种可能性的区别。你可以改变的另一件事是写，而不是onclick=.......onfocus=.....

我也不知道这里的区别。

但我希望我能帮助你。 PS：对不起，因为我英语不好，我是德国人。

来源

2013-03-28 21:01:59 Leon5637

下面的代码添加到您的javascript：

function makePasswordHidden() { 
    document.getElementById("password").setAttribute("type", "password"); 
}

更改输入密码：

<input id="password" name="password" class="input_text" type="text" value="Password" onfocus="makePasswordHidden();">

这样做是什么它使输入元素的“密码”和值被更新以便它被隐藏。如果您想为值=“密码”可见如果该字段为空，然后添加以下JavaScript函数：

function makePasswordShown() { 
    document.getElementById("password").setAttrivute("type", "text"); 
}

，并添加以下到您的密码输入：

onblur="if (this.value=='') makePasswordShown(); if (this.value=='') this.value='Password';"

来源

2015-06-19 22:35:58

回答

相关问题