更改<输入>使用JavaScript键入IE [英] Changing the <input> type in IE with JavaScript

问题描述

 < input type =textname =passwordLoginvalue =Passwordonfocus = if（this.value =='Password'）{this.value =''; this.type ='password'}; onblur =if（this.value ==''）{this.value ='Password'; this.type ='text'}; size =25/> 
  

可在除IE以外的所有网页浏览器中使用...我如何修复IE？

确定进行了一些更改仍然存在错误

我希望它像这样工作

 < input type =textname =usernameLoginvalue =Emailonfocus =if（this.value =='Email' ）{THIS.VALUE = ''};的onblur =如果（THIS.VALUE ==）{THIS.VALUE =电子邮件}; size =25/> 
  

如果我不输入任何东西，它会将值返回给您

所以我试过这个

 < td colspan =2id =passwordLoginTd> 
< input id =passwordLoginInput1type =textname =passwordLoginvalue =Passwordonfocus =passwordFocus（）size =25/> 
< input id =passwordLoginInput2style =display：none; type =passwordname =passwordLoginvalue =onblur =passwordBlur（）size =25/> 
< / td> 
< script type =text / javascript> 
 //<！[CDATA [
 
 passwordElement1 = document.getElementById（'passwordLoginInput1'）; 
 passwordElement2 = document.getElementById（'passwordLoginInput2'）; 
 
函数passwordFocus（）{
 
 passwordElement1.style.display =none; 
 passwordElement2.style.display =inline; 
 passwordElement2.focus（）; 
 
 
 $ b函数passwordBlur（）{
 
 if（passwordElement2.value ==''）{
 
 passwordElement2 .style.display =none; 
 passwordElement1.style.display =inline; 
 passwordElement1.focus（）; 
 
} 
 
} 
 
 //]]> 
< / script> 
  

您可以看到模糊不起作用= [

]

确定终于可以得到它了，这要归功于需要删除的帮助

  passwordElement1.focus（）; 
  

解决方案

您无法动态更改输入元素的类型在Internet Explorer中。

一种可能的解决方法是：

• 动态创建一个新元素。


• 将旧元素的属性复制到新元素中。


• 将新元素的类型设置为新类型。


• 然后用新元素替换旧元素。

您可能需要检查以下关于上述JavaScript植入的文章：

另一种选择是静态创建两个元素，但一次只能显示一个元素。能见度和焦点将取决于元素的价值。在这种情况下，您可能需要使用如下所示的内容：

 < script type =text / javascript> 
函数checkType（）{
 var thisElement = document.getElementById（'field_text'）; 
 var otherElement = document.getElementById（'field_password'）; 
 
 if（thisElement.value ==='Password'）{
 otherElement.style.display ='inline'; 
 thisElement.style.display ='none'; 
 otherElement.focus（）; 
} 
} 
< / script> 
 
< input type =textvalue =Passwordid =field_textonfocus =checkType（）; /> 
< input type =passwordvalue =style =display：none; id =field_password/> 
  

The line

<input type="text" name="passwordLogin" value="Password" onfocus="if(this.value=='Password'){this.value=''; this.type='password'};" onblur="if(this.value==''){this.value='Password'; this.type='text'};" size="25" />

works in all web browsers except IE... How can I fix it for IE?

Ok made some changes to still have an error

I want it to work like this like here

<input type="text" name="usernameLogin" value="Email" onfocus="if(this.value=='Email'){this.value=''};" onblur="if(this.value==''){this.value='Email'};" size="25" />

if I dont enter anything it will put the value back

So I tried this

<td colspan="2" id="passwordLoginTd">
     <input id="passwordLoginInput1" type="text" name="passwordLogin" value="Password" onfocus="passwordFocus()" size="25" />
     <input id="passwordLoginInput2" style="display: none;" type="password" name="passwordLogin" value="" onblur="passwordBlur()" size="25" />
    </td>
    <script type="text/javascript">
    //<![CDATA[

     passwordElement1 = document.getElementById('passwordLoginInput1');
     passwordElement2 = document.getElementById('passwordLoginInput2');

     function passwordFocus() {

      passwordElement1.style.display = "none";
      passwordElement2.style.display = "inline";
      passwordElement2.focus();

     }

     function passwordBlur() {

      if(passwordElement2.value=='') {

       passwordElement2.style.display = "none";
       passwordElement1.style.display = "inline";
       passwordElement1.focus();

      }

     }

    //]]>
    </script>

as you can see the blur does not work =[

ok finally got it thanks to the help needed to remove

passwordElement1.focus();

解决方案

You cannot dynamically change a the type of an input element in Internet Explorer.

One possible workaround would be to:

• Dynamically create a new element.
• Copy the properties of the old element into the new element.
• Set the type of the new element to the new type.
• Then replace the old element with the new element.

You may want to check the following article for a JavaScript implantation of the above:

• Change Input Element Type using JavaScript

Another option would be to statically create the two elements, but having only one visible at a time. The visibility and the focus would depend on the value of the elements. In this case, you may want to use something like this:

<script type="text/javascript">   
  function checkType() {
     var thisElement = document.getElementById('field_text');
     var otherElement = document.getElementById('field_password');

     if (thisElement.value === 'Password') {            
        otherElement.style.display = 'inline';
        thisElement.style.display = 'none';
        otherElement.focus();
     }
  }
</script>

<input type="text" value="Password" id="field_text" onfocus="checkType();" />
<input type="password" value="" style="display: none;" id="field_password" />

这篇关于更改<输入>使用JavaScript键入IE的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！