선택할 때 input을 활성화합니다. 그렇지 않으면 비활성화된javascript 코드

 
  
window.onload = function(){ 
  
var price = document.getElementById('price'); 
  
price.disabled = true; 
  
price.style.padding = '2px 3px'; 
  
price.style.background = '#eee'; 
  
price.style.border = '1px solid #ccc'; 
  
var tj = document.getElementById('tj'); 
  
tj.onclick = function(){ 
  
if(tj.checked == true){ //    
  
price.disabled = false; 
  
price.style.background = '#fff'; 
  
price.style.border = '2px solid #ff7d00'; 
  
price.style.padding = '2px 3px'; 
  
price.focus(); 
  
 
  
} else { 
  
price.disabled = true; 
  
price.style.background = '#eee'; 
  
price.style.border = '1px solid #ccc'; 
  
price.style.padding = '2px 3px'; 
  
} 
  
} 
  
 
  
} 
  
 
 

 
  
 
  
  ：    
  
 
  
 
 

유일하게 제거할 수 있는 것은 약간의 미화를 더해서 사용자로 하여금 한층 더 높은 층을 체험하게 하는 것이다. 그 중에서 테두리의 굵기, 초점의 획득, checkbox 테두리선의 숨김 등을 포함한다.
테스트 코드
window.onload = function(){ var price = document.getElementById('price'); price.disabled = true; price.style.padding = '2px 3px'; price.style.background = '#eee'; price.style.border = '1px solid #ccc'; var tj = document.getElementById('tj'); tj.onclick = function(){ if(tj.checked == true)price.disabled = false; price.style.background ='#fff', price.style.border ='2px solid #ff7d00', price.style.padding ='2px 3px', price.focus ();else { price.disabled = true; price.style.background = '#eee'; price.style.border = '1px solid #ccc'; price.style.padding = '2px 3px'; } } } 가격:특가
[Ctrl+A 전체 선택: 외부 Js를 가져오려면 새로 고쳐야 합니다.]