标签：
由于兼容性没有考虑周全，今天遇到了这个问题：
<html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <textarea name="" id="" cols="30" rows="10" readOnly=true>sdfasdfadsfasdf</textarea> <script src="jquery-1.9.1.js"></script> <script type="text/javascript"> $(function(){ $(‘textarea‘).on(‘click‘,function(){ //$(this).attr(‘readOnly‘,false); $(this).css(‘background-color‘,‘transparent‘) var $textarea=$(this); /** setTimeout(function(){ $textarea.focus(); }, 0); **/ $(this).attr(‘contentEditable‘,true); //$(this).focus(); }); $(‘textarea‘).on(‘blur‘,function(){ $(this).attr(‘readOnly‘,true); $(this).css(‘background-color‘,‘#666‘) }); }); </script> </body> </html>
想要的效果是直接click就可以获取光标并且输入字符,在textarea里面.无奈focus在ie中不起效果.到处找,还是在 强大的stackoverflow上面发现了答案.
第一种：直接使用 select()方法 不用focus() 但是交互性严重有问题。
第二种：stackoverflow上面有一种解决方法是用了 上面注释的 setTimeout事件，我尝试了,不起效果。【成功的朋友麻烦不灵赐教】
第三种: 仍然是在stackoverflow，上面提问者最后使用的是$(this).attr(‘contentEditable‘,true); contentEditable这个属性，能够实现这效果.但是只在ie中有效,这个做特殊处理即可。这应该是最好的解决办法了.
stackoverflow 链接：
http://stackoverflow.com/questions/9806910/textarea-is-not-editable-not-readonly-in-ie
http://stackoverflow.com/questions/3764440/ie-readonly-textarea-problem
标签：
原文地址：http://www.cnblogs.com/dongguapifly/p/4219779.html
