IE中input元素的.type为只读!

一 09

类别: WEB前台开发 — 鼠标炸弹 @ 2009.01.09 17:27 已阅3,496次
标签: IE, input, js, type, 错误

今天遇到一处错误，发现IE中input元素的.type为只读!

问题描述:

有这么一段js:

<script type="text/javascript">
<!--
function $(){
return document.getElementById?document.getElementById(arguments[0]):eval(arguments[0]);
}
//...
function safeQSelOnChange()
{
if($('safeQuestionSel').value==-1)
{
var safeQuestion = $('safeQuestion');
safeQuestion.input="text";
safeQuestion.value="";
safeQuestion.focus();
}else{
var safeQuestion = $('safeQuestion');
var safeQuestionSel = $('safeQuestionSel');
safeQuestion.input="hidden";
safeQuestion.value=safeQuestionSel.options[safeQuestionSel.selectedIndex].innerHTML;
}
}
//-->
</script>

配合这么一段html:

<select class="inputLen" name="safeQuestionSel" id="safeQuestionSel" onchange="javascript:safeQSelOnChange();" onblur="javascript:safeQSelOnChange();" >
<option value="1">你爸爸妈妈都叫你什么小名?</option>
<option value="2">你最要好的朋友叫什么?</option>
<option value="3">你最尊敬的老师是?</option>
<option value="-1" >自定义问题</option>
</select>
<br/>
<input class="inputLen" type="hidden" name="safeQuestion" id="safeQuestion" size="28" value="" />

本想实现:
允许用户在下拉列表中选择一项，若选中最后一项“自定义问题”，则文本框可见并设置其焦点；若选其他项，则文本框隐藏并被赋值为选中项的文本。
FF可以正常执行，在IE下却无法设置safeQuestion.type=”text”

FF下支持input元素.type [ = sType ],IE下input.type属性却是只读的.
官方说法: 在IE中，除了使用createElement方法动态创建的元素，其他情况下，type属性都为只读

改成Style控制显示与否咯…

<script type="text/javascript">
<!--
function $(){
return document.getElementById?document.getElementById(arguments[0]):eval(arguments[0]);
}
function safeQSelOnChange()
{
if($('safeQuestionSel').value==-1)
{
var safeQuestion = $('safeQuestion');
safeQuestion.style.display = 'block';
safeQuestion.value="";
safeQuestion.focus();
}else{
var safeQuestion = $('safeQuestion');
var safeQuestionSel = $('safeQuestionSel');
safeQuestion.style.display = 'none';
safeQuestion.value=safeQuestionSel.options[safeQuestionSel.selectedIndex].innerHTML;
}
}
//-->
</script>

<select class="inputLen" name="safeQuestionSel" id="safeQuestionSel" onchange="javascript:safeQSelOnChange();" onblur="javascript:safeQSelOnChange();" >
<option value="1">你爸爸妈妈都叫你什么小名?</option>
<option value="2">你最要好的朋友叫什么?</option>
<option value="3">你最尊敬的老师是?</option>
<option value="-1" >自定义问题</option>
</select>
<br/>
<input class="inputLen" style="display:none;margin:3px 0 3px 0 " type="text" name="safeQuestion" id="safeQuestion" size="28" value="" />

本文对您有用吗? 何不留下评论继续交流, 或者在您的博客上引用本文继续探讨.
您可以订阅读者对本文的回应或者订阅本博客以在您的阅读器中自动获取更新.