Erro de caixa de entrada somente leitura no Internet Explorer
Eu tenho um bug estranho, bem, o MSIE tem.
Parece que está falhando em todas as principais versões do MSIE: 6, 7, 8 e 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>
Deixe-me explicar como esse sistema funciona e o que está dando errado.
Quando o usuário clica (foca) na caixa de entrada, a caixa de entrada deve ser editada (isto é, perder sinalizador somente leitura). Então, quando ele sai da caixa de entrada (ou seja, evento de desfoque), algum processamento é feito (não mostrado no código) e a caixa de entrada é feita somente leitura.
Isso funciona como um encanto na maioria dos navegadores (firefox, opera, baseado em webkit), mas não em nenhuma versão do IE (incluindo 9 beta). O problema é que, no IE, o usuário precisa clicar na caixa de entrada duas vezes.
Nesse ponto, você pode perguntar se a caixa de entrada foi deixada de leitura somente na primeira vez? Não. Eu testei, o javascript relata que é editável.
Solução fácil, basta disparar um evento de clique na caixa de entrada (para simular o comportamento do clique duplo do usuário), não? Não,.click()
e.focus()
ambos falharam. Não faço ideia do porquê.
Editar: Saiba que o cursor aparece na caixa de texto, pelo menos visivelmente.
Importante: Pessoas, por favor, tente pelo menos o código antes de responder!