はunclickチェックボックス

Question

は、私が持っていたときに戻って初期状態に戻る：

<label><input type="checkbox" name="all"> text</label> 
<label><input type="checkbox" name="js-frameworks"> text</label> 

const all = document.getElementsByName('all')[0]; 
const jsFrameworks = document.getElementsByName('js-frameworks')[0]; 

this.addEventListener("change", function() { 
    if (all.checked) { 
    jsFrameworks.parentNode.className = 'readonly'; 
    } 
}); 

は私がチェックボックスにクラスの選択を解除したときに「読み取り専用」私があれば与えチェックボックスを選択したときに、コードが唯一の実行時に削除されることを考えました条件は真です。私はif条件をエスケープしているように見えないので、クリックとunclickの切り替えのようなものになります。どうやってやるの？

おかげ

Answer 1

変更もこの方法：

this.addEventListener("change", function() { 
    if (all.checked) { 
    jsFrameworks.parentNode.className = 'readonly'; 
    } else { 
    jsFrameworks.parentNode.className = ''; 
    } 
}); 

未確認のクラスを削除するこの方法です。

UPDATE：

それとも、あなたの要素が前に持っているかもしれクラス救うことができる：

let classesBefore = jsFrameworks.parentNode.className; 
this.addEventListener("change", function() { 
    if (all.checked) { 
    jsFrameworks.parentNode.className = classesBefore + ' readonly'; 
    } else { 
    jsFrameworks.parentNode.className = classesBefore; 
    } 
}); 

Answer 2

すると、この

this.addEventListener("click", function() { 
    this.parentNode.toggle('readonly'); 
} 

Answer 3

を試してみてはこれを試してみてください。

const all = document.getElementsByName("all")[0]; 
const jsFrameworks = document.getElementsByName("js-frameworks")[0]; 

this.addEventListener("change", function() { 
    if (all.checked) { 
    jsFrameworks.parentNode.classList.add("readonly"); 
    } else if (!all.checked) { 
    jsFrameworks.parentNode.classList.remove("readonly");  
    } 
});