在IE 8上输入类型密码文本

Question

我正在研究website

我遇到的问题是输入密码：

当您在 IE9 和Chrome和Mozilla等其他浏览器上点击它时，文本会发生变化，因此您可以输入密码。

但是在IE8上不会发生这种情况，如果点击它，文本就会一直停留在那里，所以我无法输入传递。

这是我的输入代码：

<input class="login_modal password" type="text" value="Contraseña" onfocus="this.type='password';this.value=''" onblur="if(this.value == ''){this.type='text';this.value='Contraseña';}" />

任何让它跨浏览器和Ie8工作的想法呢？

Answer 1

您可以使用jquery：

var defaultVal = 'Contraseña';


$('.password').on('focus', function(){
     var $this = $(this);
     var valOfThisBox = $this.val();

     if(valOfThisBox === '' ){
        this.val(defaultVal);
     }else{
        this.attr('type','password').val('');
     }
});

Answer 2

您可以使用css选择器焦点：

loginModal password:focus, loginModalPassword.focus { loginmodalpassword.type='password' }

Answer 3

我前段时间使用jQuery写了这个函数

用法：_describeInput($("#idOfYourInputField"));

替代方案：_describeInput($("input[name=NameOfYourInputField]"));

您可能想要更改正在应用的颜色，这个是深色背景网站的快速草稿。对我来说效果很好。

function _describeInput(_field=false)
{
if (!$(_field)) { return false; }

$(_field).unbind();

$(_field).focus(function(){
    $(this).val(($(this).val()==$(this).attr("description"))?"":$(this).val());
    $(this).css({"color":"white"});
});

$(_field).focusout(function(){
    $(this).css({"color":(($(this).val()==$(this).attr("description"))?"gray":"white")});           
    $(this).val(($(this).val()=="")?$(this).attr("description"):$(this).val());
});

$(_field).css({"color":"gray"}).attr("description",$(_field).val());
}