Internet Explorer中的只读输入框错误 [英] Readonly input box bug in Internet Explorer
问题描述
我有一个奇怪的错误，好吧，MSIE确实。
I've got a strange bug, well, MSIE does.
似乎所有主要的MSIE版本都失败了：6,7,8和9（！ ）
Seems it is failing on all major MSIE versions: 6, 7, 8 and 9 (!)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb" lang="en-gb" ><head><title>test</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
var test=jQuery('#in');
test.focus(function(){
if(test.val()=='empty')test.val('');
test.attr('readonly',false);
});
test.blur(function(){
if(test.val()=='')test.val('empty');
test.attr('readonly',true);
});
});
</script>
</head><body>
<input type="text" value="empty" readonly="readonly" id="in"/>
</body></html>
让我解释一下这个系统是如何工作的以及出了什么问题。
Let me explain how this system works and what is going wrong.
当用户点击（聚焦）输入框时，输入框应该是可编辑的（即丢失只读标志）。然后，当他/她离开输入框（即模糊事件）时，一些处理完成（未在代码中显示）并且输入框是只读的。
When the user clicks (focuses) the input box, the input box should be made editable (ie, lose readonly flag). Then, when s/he leaves the input box (ie, blur event) some processing is done (not shown in code) and the input box is made readonly.
这在大多数浏览器（firefox，opera，webkit）中都有魅力，但不是任何版本的IE（包括9 beta）。
问题是在IE中，用户必须单击输入框两次。
This works like a charm in most browsers (firefox, opera, webkit-based), but not any version of IE (including 9 beta). The problem is that in IE, the user has to click the input box twice.
此时，您可能会问输入框是否只读取第一个时间？
编号我测试了它，javascript报告它是可编辑的。
At this point, you might ask is the inputbox left readonly the first time? No. I tested it, javascript reports that it is editable.
轻松修复，只需触发输入框上的点击事件（模拟用户的双倍）点击行为），不是吗？
否， .click（）和 .focus（）都失败了。不知道为什么。
Easy fix, just fire a click event on the input box (to simulate the user's double click behavior), no?
No, .click() and .focus() both failed. No idea why.
编辑：知道光标确实出现在文本框中，至少是明显的。
Know that the cursor does show up in the text box, at least visibly.
重要提示：人们，请在回答之前至少尝试代码！
Important: People, please do at least try the code before answering!
推荐答案
我不会说这是一个错误。
如果更改该值，则还会删除当前的textRange。
I wouldn't say it's a bug. If you change the value, you also remove the current textRange.
尝试 test.select（），它应该将光标返回到输入。
Try test.select() , it should give the cursor back to the input.
test.focus()
将导致循环以内存不足 - 错误结束。
will result in a loop that will end in an "not enough memory"-error.
这篇关于Internet Explorer中的只读输入框错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
