확인란에 대한 jquery 작업 요약

이 글은 체크박스를 조작하는 몇 가지 jQuery 방법과 기술을 요약하고 소개합니다. 도움이 필요한 친구들이 참고할 수 있습니다.

jquery 작업 체크박스에 대한 12가지 팁.

1. 단일 체크박스 선택 항목 가져오기(3가지 작성 방법)

$("input:checkbox:checked").val()

또는

$("input:[type='checkbox']:checked").val();

또는

$("input:[name='ck']:checked").val();

2. 여러 개의 체크박스 선택 항목 가져오기

$('input:checkbox').each(function() {
if ($(this).attr('checked') ==true) {
alert($(this).val());
}
});

3. 첫 번째 체크박스를 선택한 값으로 설정

$('input:checkbox:first').attr("checked",'checked');

또는

$('input:checkbox').eq(0).attr("checked",'true');

4. 마지막 체크박스를 선택한 값으로 설정

$('input:radio:last').attr('checked', 'checked')

또는

$('input:radio:last').attr('checked', 'true')

5. 다음에 따라 설정합니다. 인덱스 값 체크박스는 선택된 값

$('input:checkbox).eq(索引值).attr('checked', 'true');

인덱스 값 = 0,1,2....
또는

$('input:radio').slice(1,2).attr('checked', 'true');

6. 여러 개의 체크박스를 선택하고 첫 번째와 두 번째 체크박스를 동시에 선택하세요

$('input:radio').slice(0,2).attr('checked','true');

7. Value 값에 따라 체크박스를 선택한 값으로 설정

$("input:checkbox[value='1']").attr('checked','true');

8. 값이 1인 체크박스 삭제

$("input:checkbox[value='1']").remove();

9.

$("input:checkbox").eq(索引值).remove();

색인 값=0,1,2....

세 번째 확인란을 삭제하는 경우:

$("input:checkbox").eq(2).remove();

10. 체크박스 통과

$('input:checkbox').each(function (index, domEle) {
//写入代码
});

11 . 모두 선택

$('input:checkbox').each(function() {
$(this).attr('checked', true);
});

12. 모두 선택 해제

$('input:checkbox').each(function () {
$(this).attr('checked',false);
})

CheckBox에서 JQuery의 일부 관련 작업

1. 선택기를 통해 CheckBox를 선택합니다.

1. ID를 설정합니다. ID 선택기 선택을 통해 CheckBox에 속성:

  <input type="checkbox" name="myBox" id="chkOne" value="1" checked="checked" />

JQuery:

    $("#chkOne").click(function(){});

2. 클래스 선택기를 통해 선택된 CheckBox 속성에 대한 클래스 설정:

  <input type="checkbox" name="myBox" class="chkTwo" value="1" checked="checked" />

JQuery:

    $(".chkTwo").click(function(){});

3. 태그 선택기 및 속성 선택기를 통해 선택:

  <input type="checkbox" name="someBox" value="1" checked="checked" />
  <input type="checkbox" name="someBox" value="2" />

JQuery:

    $("input[name='someBox']").click(function(){});

2. CheckBox 작업:

다음 checkBox 코드를 예로 들어 보겠습니다.

  <input type="checkbox" name="box" value="0" checked="checked" />
  <input type="checkbox" name="box" value="1" />
  <input type="checkbox" name="box" value="2" />
  <input type="checkbox" name="box" value="3" />

1. 각각()을 사용합니다. 체크박스 탐색 방법:

    $("input[name='box']").each(function(){});

2. attr()을 사용하여 선택할 체크박스를 설정합니다. 방법:

   $("input[name='box']").attr("checked","checked");

HTML에서는 체크박스를 선택하면 해당 태그가 check="checked"됩니다. 하지만 jquery Alert($("#id").attr("checked"))를 사용하면 "checked" 대신 "true"라는 메시지가 표시되므로 if("checked"==$( "#id" ).attr("checked"))가 잘못되었습니다. if(true == $("#id").attr("checked"))

값을 가져옵니다. 선택한 확인란의 선택:

  $("input[name='box'][checked]").each(function(){
  if (true == $(this).attr("checked")) {
     alert( $(this).attr('value') );
  }

또는:

  $("input[name='box']：checked").each(function(){
  if (true == $(this).attr("checked")) {
     alert( $(this).attr('value') );
  }

$ ("input[ name='box']: selected")와 $("input[name='box']")의 차이점은 무엇입니까? $("input[name)을 사용해 본 적이 없습니다. ='box']") 성공했습니다. .

4. 선택되지 않은 체크박스의 값을 가져옵니다:

  $("input[name='box']").each(function(){
     if ($(this).attr('checked') ==false) {
        alert($(this).val());
      }
   });

5. 체크박스의 값 속성 값을 설정합니다:

     $(this).attr("value",值);

【관련 추천 튜토리얼】

1.

JavaScript 동영상 튜토리얼

2.JavaScript 온라인 매뉴얼
3. 부트스트랩 튜토리얼