JS wenn Anweisung scheint nicht zu arbeiten

Question

Ich habe ein Kontrollkästchen, und wenn es aktiviert ist, möchte ich Textfelder bearbeitbar sein. Wenn es deaktiviert bleibt, möchte ich, dass die Textfelder readOnly sind. Hier ist meine JS:

if (document.getElementById('itemize').checked==false) { 
    document.getElementById('budget_1').readOnly = true; 
} else { 
    document.getElementById('budget_1').readOnly = false; 
    } 

Mein HTML-Code für das Kontrollkästchen:

<input type="checkbox" id="itemize" style="width: 20px; height: 20px;" /> 

Die JS scheint das Textfeld readonly einfach gut zu machen, aber wenn ich sicher, das Kontrollkästchen aktiviert wird, um das Textfeld bleibt readOnly. Irgendwelche Vorschläge?

Answer 1

Sie müssten einen Event-Handler ausführen verwenden, wenn das Kontrollkästchen Zustand ändert

var 
 
     budget_1 = document.getElementById('budget_1'), 
 
     itemize = document.getElementById('itemize'); 
 
     
 
    itemize.addEventListener("change", readonly); 
 

 
    function readonly(){ 
 
     if (itemize.checked==false) { 
 
      budget_1.readOnly = true; 
 
     } else { 
 
      budget_1.readOnly = false; 
 
     } 
 
    }

<input type="checkbox" id="itemize"/> 
 
<input type="text" id="budget_1" readonly/>