HTML 콤 보 상자 와 체크 박스, 라디오 이벤트 소개

2844 단어
checkbox 와 radio 의 이벤트 선택 은 한때 나 를 현혹 시 켰 다.처음에 제 가 js 에 대한 이해 로 볼 때 저 는 change 사건 이 가장 합 리 적 이 어야 한다 고 생각 했 습 니 다. 안 타 깝 게 도 ie 에서 change 사건 은 변화 한 후에 초점 이 떠 날 때 촉발 되 었 습 니 다.나중에 click mousedown 등 마우스 이벤트 로 대 체 했 습 니 다.click 이 mousedown 보다 더 완벽 한 것 을 발견 했다. radio 가 click 사건 을 등록 한 후에 신기 한 것 은 키보드 의 상하 좌우 로 선택 할 때 마우스 사건 을 촉발 하고 롤러 도 촉발 하 는 것 이다. 이런 신기 한 일 은 mousedown 아래 에서 발생 하지 않 을 것 이다.(webkit 는 상하 좌우 선택 을 사용 할 수 없습니다) checkbox 가 click 이 벤트 를 등록 한 후에 기적 이 다시 발생 합 니 다. 우리 가 빈 칸 으로 checkbox 를 선택 할 때 신기 한 click 이벤트 가 다시 발생 하고 mousedown 은 다시 기적 과 스 쳐 지나 갑 니 다.(webkit 는 빈 칸 으로 선택 할 수 없습니다) 우리 모두 click 을 사용 합 시다. 이 두 노형 에 게 부담 을 줄 입 시다. 그들 을 위해 선천적으로 부족 한 사건 을 연결 하지 마 세 요. 이 두 녀석 에 게 click 이 만능 입 니 다.경 배 ~ ~ ~ 폼 으로 조사 표를 디자인 할 때 사용자 의 동작 을 줄 이기 위해 선택 상 자 를 사용 하 는 것 은 좋 은 생각 입 니 다. HTML 태그 에는 두 가지 선택 상자 가 있 습 니 다. 즉, 체크 상자 와 체크 상자 입 니 다. 두 가지 차이 점 은 체크 상자 의 옵션 사용 자 는 한 가지 만 선택 할 수 있 고 체크 상자 의 옵션 사용 자 는 여러 가지 선택 을 할 수 있 으 며 심지어 모두 선택 할 수 있 습 니 다.아래 의 예 를 보십시오. 다음은 이 예 의 소스 코드 를 제시 하고 코드 와 결합 하여 각 매개 변수의 설정 을 말 합 니 다. 여행 을 좋아 하 십 니까?선택:
 
  





운동 에 관심 이 있 으 시 면 선택 하 십시오.
 
  







위의 소스 코드 에서 보 듯 이 체크 상 자 를 만 들 려 면 표 시 된 type 매개 변 수 를 type = "radio" 로 설정 하면 됩 니 다.체크 상 자 를 만 들 려 면 표 시 된 type 인 자 를 type = "checkbox" 로 설정 하면 됩 니 다.실제 응용 에서 그런 선택 상 자 를 사용 하 는 것 은 실제 수요 에 따라 정 해 야 한다.사용자 가 선택 한 것 만 있 으 면 선택 상자 로 합 니 다. 예 를 들 어 이 예 에서 '여행 을 좋아 하 십 니까?' 라 는 문 제 는 사용자 가 선택 할 수 밖 에 없 기 때문에 선택 상 자 를 사용 합 니 다.사용자 가 여러 가지 선택 한 내용 을 허용 한다 면, 이 예 에서 '당신 은 그 운동 에 관심 이 있 습 니까?' 와 같은 체크 상 자 를 사용 합 니 다. 이 문 제 는 한 사람의 관심 이 여러 가지 일 수 있 기 때문에 체크 상 자 를 사용 합 니 다.
태그 에 checked 인 자 를 설정 하면 이 상 자 는 기본적으로 선 택 됩 니 다.예 를 들 어 첫 번 째 체크 상자 ("좋아" 아래 의 체크 상자) 는 기본 선택 으로 설정 합 니 다. 그러면 사용자 가 "좋아" 를 선택 하려 면 더 이상 선택 하지 않 아 도 됩 니 다. 물론 사용자 가 "싫어" 를 선택 하려 면 "싫어" 아래 의 체크 상 자 를 클릭 하면 기본 값 이 자동 으로 취 소 됩 니 다.같은 방법 으로 선택 상 자 를 기본 값 으로 설정 할 수 있 습 니 다.그러나 체크 상자 의 기본 선택 은 남용 할 수 없습니다. 그렇지 않 으 면 사용자 의 반감 을 불 러 일 으 킬 수 있 습 니 다.
라디오 에 서 는 이 대상 의 name 속성 을 모두 동일 하 게 설정 하 는 것 을 주의해 야 합 니 다. 예 를 들 어 상례 의 name = "radiobutton" 은 ID 속성 이 아니 라 는 것 을 기억 해 야 합 니 다. 그래 야 단독 선택 효 과 를 실현 할 수 있 습 니 다. 그렇지 않 으 면 상례 의 '좋아요', '싫어 요', '괜찮아 요' 를 동시에 선택 할 수 있 습 니 다. 기억 하 세 요!

좋은 웹페이지 즐겨찾기