Оператор JS if не работает

Question

У меня есть флажок, и если он установлен, я хочу, чтобы текстовые поля были доступны для редактирования. Если он не установлен, тогда я хочу, чтобы текстовые поля были прочитаны только. Вот мои JS:

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

Моего HTML для флажка:

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

JS, кажется, делает текстовое поле READONLY просто отлично, но когда я убедитесь, что флажок установлен, текстовое поле остается прочитанным только. Какие-либо предложения?

Answer 1

Вам нужно будет использовать обработчик событий для запуска, когда флажок изменяет состояние

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/>