入力テキストフィールドのデフォルトカーソルプロパティを設定するにはどうすればよいですか？

Question

function editButtonClicked(){ 
 
    var txtEle = document.getElementById("txtUsername"); 
 
    txtEle.style.disabled = false; 
 
    txtEle.style.cursor = "auto"; 
 
    txtEle.style.background="white"; 
 
}

#txtUsername{ 
 
    cursor:not-allowed; 
 
}

<form> 
 
    <input type="text" id="txtUsername" value="some text" disabled="disabled"> 
 
    <input type="button" id="btnEdit" value="edit" onclick="editButtonClicked()"> 
 
</form>

私はいくつかのテキスト入力フィールドと編集ボタンが含まれていformは、各テキストフィールドに対応しています。 最初はtextfieldが無効で、カーソルのプロパティがnot-allowedでした。 Editボタンをクリックした後、textfieldを有効にして、カーソルのプロパティをブラウザのデフォルトに設定します。

function btnUEditClick() { 
    var txtEle = document.getElementById("txtUsername"); 
    txtEle.style.disabled = false; 
    txtEle.style.cursor = "default"; 
} 

しかし、問題はdefaultとしてカーソルプロパティを設定した後、私はtextfieldを編集することはできませんです。

どうすればこの問題を解決できますか？あなたは要素を有効にして、フィールド

に集中する間違った方法を使用している

Answer 1

これは、あなたがdisabled属性ではなくスタイルプロパティの値を変更している

function btnUEditClick() { 
    var txtEle = document.getElementById("txtUsername"); 
    txtEle.disabled = false; 
    document.getElementById("txtUsername").focus(); 
} 

Answer 2

を行うだろう。したがって、この行：

txtEle.disabled = false;