Cursor focus not coming in the password field.
I am using the below code for swap an input text field to a password area on focus.
<input type="text" name="password" id="password" onblur="ChangeToTextField(); if (this.value == '') {this.value = 'password';}" onfocus="ChangeToPassField(); if (this.value == 'password') { this.value = '';}else { this.value; }" value="password" style="width:230px; height:25px; margin-left:5px; background:none; border:0px;" />
<script type="text/javascript">
function ChangeToPassField() {
document.getElementById('password').type="password";
var input = document.getElementById('password');
input.focus();
}
function ChangeToTextField() {
if(document.getElementById('password').value=="" || document.getElementById('password'开发者_如何转开发).value == "password" )
{
//alert("hai");
document.getElementById('password').type="text";
document.getElementById('password').value="password";
}
}
</script>
If i click in password field the cursor is not blinking in the password field. How can i display cursor pointer in the password field?...
What about using the HTML 5 placeholder attribute? (keep in mind it won't work everywhere)
<!DOCTYPE html>
<!-- ... -->
<form>
<input placeholder="Password" type="password" name="password" id="password" />
<input type="submit" />
</form>
jsfiddle: http://jsfiddle.net/ndduP/
Otherwise, here is an attempt at what you are trying to do (keep in mind some people could potentially have javascript turned off making this problematic from a security/privacy standpoint)
<form>
<input type="text" name="password" id="password_field" value="Password" onfocus="make_pass();" onblur="make_text();" />
<input type="submit" />
</form>
<script>
function make_text() {
var field = document.getElementById('password_field');
if (field.value.replace(/ /g,'') === "") {
field.type = "text";
field.value = "Password";
}
}
function make_pass() {
var field = document.getElementById('password_field');
if (field.type === "text") {
field.value = "";
field.type = "password";
}
}
</script>
jsfiddle: http://jsfiddle.net/utEVx/
<input type="text" name="password" id="password" value="password" style="width:230px; height:25px; margin-left:5px; background:none; border:0px;" />
<script>
var passwordF = document.getElementById("password");
passwordF.onblur = function() {
ChangeToTextField();
if (this.value === '') {
this.value = '';
}
};
passwordF.onfocus = function() {
ChangeToPassField();
if (this.value === 'password') {
this.value = '';
}
};
function ChangeToPassField() {
console.log("changed to pass field...");
document.getElementById('password').type="password";
var input = document.getElementById('password');
input.focus();
}
function ChangeToTextField() {
console.log("changed to text field...");
if(document.getElementById('password').value=="" ||
document.getElementById('password').value == "password" )
{
//alert("hai");
document.getElementById('password').type="text";
document.getElementById('password').value="password";
}
}
</script>
加载中,请稍侯......
精彩评论