Question

我今天已经问了一个问题：This one

现在我有一个有效的代码，但只能在FF（完全）中工作，部分在IE中工作（7和8）。

function replaceT(obj){
     var newO=document.createElement('input');
     newO.className = obj.className;
     newO.style.width = '118px';
     newO.style.height = '17px';
     newO.style.color = '#666';
     newO.setAttribute('maxlength','30');
     newO.setAttribute('type','password');
     newO.setAttribute('onblur','this.value=\'Password\'; this.type=\'text\'');
     newO.setAttribute('onfocus','this.value=\'\'; this.type=\'password\'');
     newO.setAttribute('tabindex','2');
     newO.setAttribute('value','');
     newO.setAttribute('id','password_property_input');
     newO.setAttribute('name',obj.getAttribute('name'));
     obj.parentNode.replaceChild(newO,obj);
     newO.focus();
}

在firefox中一切都很完美，我把这个函数称为焦点，所以我的旧类型密码输入变成了类型文本输入。

现在，当我点击此输入（onblur）外部时，我再次将字段类型更改为文本，并将值恢复为密码。如果再次单击该字段（onfocus），我的文本类型输入将再次成为密码，值将返回到''。

这在FF中非常有效，但是在IE中没有一个可行，当我说不，我的意思是onblur和onfocus。从文本到密码输入的第一个更改工作。谢谢你的回答

我找到了更好的解决方案，但它在IE中也不起作用：

在window.load函数里面放了：

applyPasswordType(document.getElementById('password_property_input'), 'Password', 'text');

功能本身..

function applyPasswordType(elem, val, typ) {
      elem.value = val;
      elem.type = typ;
      elem.onfocus = function() {
        if(this.value == val) {
          this.style.color = '';
          this.type = 'password'; //If in focus, input type will be 'password'
          this.value = '';
        }
      }

      elem.onblur = function() {
         if(this.value == '') {
           this.value = val;
           this.type = 'text'; //On blur, input type will be 'text' in order to show value
         }
       }
     }

我仍在尝试弄清楚如何使用addeventlistener修复此问题。

Answer 1

setAttribute在IE中被破坏，请勿使用它。

直接使用属性：

foo.onevent = function () { ... }

更好的是，使用addEventListener/attachEvent

您可能还会发现IE无法更改现有输入的类型。如果是这样，您将必须创建一个新输入并替换现有输入。

跟进关于输入焦点和模糊的问题

1 个答案: