Jquery는 체크박스 전체 선택 method_jquery를 구현합니다.-JS 튜토리얼-php.cn

어제 아침에 Jquery를 사용하여 모두 선택하는 방법에 대해 글을 썼습니다.

여러분의 의견을 바탕으로 프로그램의 부족한 부분을 일부 수정했습니다. 제 레벨의 한계도 있고, 고려할 수 없는 부분도 많기 때문입니다.

글 말미에 질문을 올렸는데, 그것을 보편적으로 부르는 방법을 쓰고 싶어서 밤에 집에 와서 그 효과를 적어봤습니다

아래 예시는 모두가 토론하고 배울 수 있는 예시입니다. 괜찮다고 생각되면 프로젝트에 직접 적용할 수도 있습니다.

한 문장에서 모두 선택하고 없음을 선택하는 온라인 방법은 많지만 모두 선택하는 체크박스는 아래 하위 체크박스를 제어할 수 있지만 아래 하위 체크박스도 제어할 수 있어야 한다는 점을 간과한 것 같습니다. 위의 모든 선택을 제어하십시오. 이것이 내 방법입니다.

2: 개발 과정: 보편성을 구현하려면 그룹화 방법과 그룹에서 어떤 확인란을 선택해야 하는지 두 가지 문제를 해결해야 합니다. 이름별로 그룹화하는 방법을 사용할 수 있다고 생각했습니다. ,

클래스를 사용하여 전체 선택이 필요한 체크박스 그룹인지 확인하세요. 먼저 선택해야 하는 클래스를 모두 찾은 다음 name 속성을 찾으면 해당 요소를 찾으면 다른 하위 확인란을 찾을 수 있습니다.

3: 파일, 다음은 제가 구현한 js이며 xs_checkbox_all.js로 저장됩니다

$(문서).ready(함수 () {
var xsChk = "xsChk";//정의된 스타일
var xsChkAll = "input[type='checkbox'][class='" xsChk "'][name]";//이 스타일을 정의하는 모든 체크박스
$(xsChkAll).each(함수 () {
var name = $(this).attr("name");
           name = "input[type='checkbox'][class!='" xsChk "'][name='" name "']";//이 전체 선택 상자 아래 하위 확인란
           $(this).click(function () {
               $(name).attr("checked", $(this)[0].checked);
         })
var xschk = $(this);
           $(이름).click(함수 () {
               var IAll = $(name).length; //이 하위 프로젝트의 모든 체크박스 수
               var IChk = $(name ":checked").length; //이 하위 프로젝트에서 선택된 모든 체크박스의 수
var isAllChecked = true //모두 선택되었는지 여부
                  if (IAll != IChk) {
~
            }
                 $(xschk).attr("checked", isAllChecked);
        });
});
});