jQuery에서 라디오 버튼이 선택 또는 선택되었는지 확인하는 방법은 무엇입니까?
14346 단어 mysqljavascriptjqueryphp
이 게시물에서는 jquery를 사용하여 라디오 버튼이 이미 선택되어 있는지 확인하는 방법에 대해 설명합니다. 이는 일반적으로 추가 확인이 포함된 양식을 작성하는 경우에 적용됩니다. 이는 서버 측에 라디오 버튼을 제출하기 전에 어떤 라디오 버튼이 선택되었는지 결정하는 데 유용합니다. 귀하의 요구에 적합한 3가지 방법을 선택하여 적용해 보겠습니다.
방법 #1
:checked 선택자 및 val()과 함께 if 문을 사용하여 확인 여부를 확인합니다.
// Method #1 - check using if statement with :checked selector and val() to determine if checked
$("#btnSubmit1").on("click", function() {
if($(".status1:checked").val()) {
alert('checked')
} else {
alert('not checked.')
}
});
방법 #2
.is() 함수와 :checked 선택자를 사용하여 라디오 버튼이 선택되었는지 확인합니다.
// Method #2 - check using is() function to determine if the radio button is checked
$("#btnSubmit2").on("click", function() {
if($(".status2").is(':checked')) {
alert('checked')
} else {
alert('not checked.')
}
});
방법 #3
:checked 선택자를 사용하여 라디오 버튼 요소를 반복합니다. 선택한 라디오 버튼이 여러 개인 경우에 유용합니다.
// Method #3 - loop the radio button elements with :checked selector.
// useful if you have multiple selected radio button
$("#btnSubmit3").on("click", function() {
$("[type=\"radio\"]:checked").each(function() {
alert('checked')
});
});
이제 선택한 라디오 버튼을 확인하는 방법에 대한 아이디어를 얻었습니다. 자신에게 맞는 것을 선택하십시오. 이제 이 게시물의 전체 소스 코드를 공유하겠습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>How to Check if Radio Button is Checked or Selected in jQuery?</title>
</head>
<body>
<h1>How to Check if Radio Button is Checked or Selected in jQuery?</h1>
<h2>Method #1 - check using if statement with :checked selector and val() to determine if checked</h2>
<form id="form1">
<label>Click here
<input type="radio" value="1" name="status1" class="status1" required="required">
</label>
<br/><br/>
<button type="button" id="btnSubmit1">Check Status</button>
</form>
<br/><br/><br/><br/>
<h2>Method #2 - check using is() function to determine if the radio button is checked</h2>
<form id="form2">
<label>Click here
<input type="radio" value="regular" name="status2" class="status2" required="required">
</label>
<br/><br/>
<button type="button" id="btnSubmit2">Check Status</button>
</form>
<br/><br/><br/><br/>
<h2>Method #3 - loop the radio button elements with :checked selector</h2>
<p>useful if you have multiple selected radio button</p>
<form id="form3">
<label>Click here
<input type="radio" value="regular" name="status3" class="status3" required="required">
</label>
<br/><br/>
<button type="button" id="btnSubmit3">Check Status</button>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// Method #1 - check using if statement with :checked selector and val() to determine if checked
$("#btnSubmit1").on("click", function() {
if($(".status1:checked").val()) {
alert('checked')
} else {
alert('not checked.')
}
});
// Method #2 - check using is() function to determine if the radio button is checked.
$("#btnSubmit2").on("click", function() {
if($(".status2").is(':checked')) {
alert('checked')
} else {
alert('not checked.')
}
});
// Method #3 - loop the radio button elements with :checked selector.
// useful if you have multiple selected radio button.
$("#btnSubmit3").on("click", function() {
$("[type=\"radio\"]:checked").each(function() {
alert('checked')
});
});
});
</script>
</body>
</html>
이 튜토리얼이 도움이 되었으면 합니다. 이 코드를 다운로드하려면 여기https://codeanddeploy.com/blog/jquery/how-to-check-if-radio-button-is-checked-or-selected-in-jquery를 방문하십시오.
행복한 코딩 :)
Reference
이 문제에 관하여(jQuery에서 라디오 버튼이 선택 또는 선택되었는지 확인하는 방법은 무엇입니까?), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/codeanddeploy/how-to-check-if-radio-button-is-checked-or-selected-in-jquery-22g8텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)