设置readOnly = false IE后无法更改文本

Question

I have this sample code, and It's not working just in IE. Is there an IE bug?

<input type="text" readonly="true" onclick="setReadonlyfalse(this)" />

<script type="text/javascript">
    function setReadonlyfalse(ed){
        ed.readOnly = false;
    }
</script>

I'm simulating a situation that after my grid show an editor, I receive a response from server to set my editor to readonly=false. (it was rendered with readonly=true)

edit:

I'm using ExtJS 3.4, and the code do this:

/**
 * Sets the read only state of this field.
 * @param {Boolean} readOnly Whether the field should be read only.
 */
setReadOnly : function(readOnly){
    if(this.rendered){
        this.el.dom.readOnly = readOnly;
    }
    this.readOnly = readOnly;
}

edit2 : I'm adjusted the code to be more correct

<input type="text" readonly="readonly" onclick="removeReadonly(this)" value="hehehe" />
<script type="text/javascript">
    function removeReadonly(ed){
        ed.removeAttribute("readonly");
    }
</script>

Answer 1

Remove the readonly attribute from the element programmatically, then set readOnly to false .

ed.removeAttribute('readonly'); // only needed the first time
ed.readOnly = false;

Yes, this is an IE bug.