> 웹 프론트엔드 > JS 튜토리얼 > 선택하면 입력을 활성화하는 JavaScript 코드, 그렇지 않으면 비활성화된_form 효과

선택하면 입력을 활성화하는 JavaScript 코드, 그렇지 않으면 비활성화된_form 효과

WBOY
풀어 주다: 2016-05-16 18:39:36
원래의
1201명이 탐색했습니다.
复제대码 代码如下:

window.onload = function(){
var 가격 = 문서 .getElementById('가격');
price.disabled = true;
price.style.padding = '2px 3px';
price.style.Background = '#eee';
price.style.border = '1px 솔리드 #ccc';
var tj = document.getElementById('tj');
tj.onclick = function(){
if(tj.checked == true){ //표시
price.disabled = false;
가격.스타일.배경 = '#fff';
price.style.border = '2px 솔리드 #ff7d00';
price.style.padding = '2px 3px';
가격.초점();

} else {
price.disabled = true;
price.style.Background = '#eee';
price.style.border = '1px 솔리드 #ccc';
price.style.padding = '2px 3px';
}
}

}

复system代码 代码如下:


价格: 特价


唯一的可去之外是加了一点美化,使用户体验更加一层楼,其中包括边框的加粗,焦点的获取,checkbox边框정말 隐藏等等。
测试代码

[Ctrl A 전체选 注:如需引入외부Js需刷新才能执行
]
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿