집 >웹 프론트엔드 >JS 튜토리얼 >질문에 대한 답변을 위해 확인란이 선택되었는지 여부를 jQuery를 기반으로 구현합니다.

질문에 대한 답변을 위해 확인란이 선택되었는지 여부를 jQuery를 기반으로 구현합니다.

WBOY원래의: 2016-05-16 15:26:171280검색

최근 프로젝트 요구 사항에서 만난 기능 포인트는 사용자가 선택한 옵션에 따라 해당 프롬프트가 제공됩니다. 테스트 프로그램의 렌더링은 매우 만족스러운지 확인하기 위해 제공됩니다. 전체 내용을 보려면 계속하세요.

1. 구현 원칙:

1단계: 사용자가 어떤 항목을 선택했는지, 즉 어떤 확인란이 선택되었는지 확인

2단계: 확인란 선택에 따라 해당 프롬프트 제공

2. 메인 프로그램을 살펴보겠습니다.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>
  </head>
  <body>
    <input type="checkbox" id="checkbox01" />A <br />
    <input type="checkbox" id="checkbox02" />B <br />
    <input type="checkbox" id="checkbox03" />C <br />
    <input type="checkbox" id="checkbox04" />D <br />
    <input type="button" id="button" value="提交" />
    <h4 >提示本题是单选题且正确答案是A</h4>
    <script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/layout.js" type="text/javascript" charset="utf-8"></script>
  </body>
</html>

위에서 볼 수 있듯이 이 질문은 객관식 질문이고 정답은 A라고 가정하고 JQ를 사용하여 구현하겠습니다~~~

3. jQuery 프로그램

$(function(){
//假设正确答案是A
$("#button").click(function(){
if($("input").filter(":checked").length==0){
alert("请选择一个选项再提交");
}elsif($("#checkbox01").filter(":checked").length!=0&&$("#checkbox02").filter(":checked").length==0&&$("#checkbox03").filter(":checked").length==0&&$("#checkbox04").filter(":checked").length==0){
alert("您选择的答案是正确的！")
}else{
alert("您选择的答案是错误的！")
}
})
}

체크박스 선택 여부를 결정하는 프로그램을 인터넷에서 많이 본 적이 있는데, 테스트해 본 결과 대부분은 프로그램을 삭제하는 jquery 버전 업데이트로 인해 발생하는 것으로 보입니다. $("#id ").filter(":checked").length==0을 사용했습니다. 어떤 옵션이 선택되어 테스트되었는지 확인하는 것이 가능합니다~~~ 다른 방법이 있으면 제안해 주세요. 숭배해요~~

위 코드는 jQuery를 기반으로 체크박스 선택 여부를 묻는 관련 정보를 구현한 것입니다.

성명：

이전 기사：jQuery_jquery를 시작하기 위한 계층적 선택기 예제에 대한 간략한 분석다음 기사：jQuery_jquery를 시작하기 위한 계층적 선택기 예제에 대한 간략한 분석

질문에 대한 답변을 위해 확인란이 선택되었는지 여부를 jQuery를 기반으로 구현합니다.

관련 기사