Ursprünglich auf https://codeanddeploy.com gepostet, besuchen Sie den Beispielcode und laden Sie ihn herunter:https://codeanddeploy.com/blog/jquery/how-to-check-if-radio-button-is-checked-or-s selected-in -jquery
In diesem Beitrag werden wir darüber sprechen, wie Sie mit jquery überprüfen können, ob Ihr Optionsfeld bereits aktiviert ist. Dies ist normalerweise anwendbar, wenn Sie Formulare mit zusätzlicher Überprüfung erstellen. Dies ist hilfreich, um festzustellen, welches Optionsfeld aktiviert ist, bevor Sie es an Ihre Serverseite senden. Ich werde Ihnen 3 Methoden mitteilen, die Sie auswählen und anwenden können, die für Ihre Bedürfnisse geeignet sind.
Methode Nr. 1
Überprüfen Sie mit der if-Anweisung mit :checked Selektor und val(), um festzustellen, ob aktiviert
// 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.')
}
});
Methode Nr. 2
Prüfen Sie mit der Funktion .is() und dem Selektor :checked, ob das Optionsfeld aktiviert ist
// 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.')
}
});
Methode Nr. 3
Loopen Sie die Radiobutton-Elemente mit :checked Selektor. Nützlich, wenn Sie mehrere Optionsfelder ausgewählt haben
// 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')
});
});
Jetzt haben Sie die Idee, wie Sie das ausgewählte Optionsfeld überprüfen können. Wählen Sie einfach aus, was zu Ihnen passt. Jetzt werde ich den vollständigen Quellcode dieses Beitrags teilen.
<!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>
Ich hoffe, dieses Tutorial kann Ihnen helfen. Besuchen Sie bitte hier https://codeanddeploy.com/blog/jquery/how-to-check-if-radio-button-is-checked-or-selected-in-jquery, wenn Sie diesen Code herunterladen möchten.
Viel Spaß beim Programmieren :)
