En développement web, il est souvent nécessaire d'obtenir le statut coché d'une case à cocher. L'utilisation de jQuery peut simplifier ce processus.
jQuery est une bibliothèque JavaScript rapide, petite et riche en fonctionnalités. Il fournit une API JavaScript pratique et simplifiée pour la traversée et la manipulation de documents HTML, la gestion des événements, l'animation, Ajax et d'autres opérations. La philosophie de conception de jQuery est « Écrivez moins, faites plus ». Elle peut aider les développeurs à utiliser du code simple pour implémenter des fonctions complexes. Dans le développement front-end, jQuery est devenu un outil incontournable.
Lorsque vous utilisez jQuery pour obtenir l'état sélectionné d'une case à cocher, vous devez utiliser le sélecteur de jQuery pour sélectionner l'élément à exploiter, puis obtenir l'état sélectionné via les méthodes fournies par jQuery.
Voici un exemple simple :
<input type="checkbox" id="checkbox1" name="option1" value="1">选项1 <input type="checkbox" id="checkbox2" name="option2" value="2">选项2 <input type="checkbox" id="checkbox3" name="option3" value="3">选项3 <button id="submitBtn">提交</button> <script> $(function() { $('#submitBtn').on('click', function() { var checkedVals = $('input[name="option"]:checked').map(function() { return this.value; }).get(); console.log('选中的值为:' + checkedVals.join(', ')); }); }); </script>
Dans l'exemple ci-dessus, il y a trois cases à cocher et un bouton. Lorsque vous cliquez sur le bouton, le code obtient la valeur de la case sélectionnée et l'imprime sur la console.
Les méthodes impliquées dans le code sont :
$('#submitBtn').on('click', function() {. .})
: Fonction exécutée lorsque le bouton est cliqué. $('#submitBtn').on('click', function() {...})
:在按钮被点击时执行的函数。$('input[name="option"]:checked')
:选择所有name为“option”,且被选中的复选框。.map(function() {...})
:通过函数返回值,对选中的复选框的值进行映射。.get()
$('input[name="option"]:checked')
: Cochez toutes les cases dont le nom est "option" et sont sélectionnées. .map(function() {...})
: Mappez la valeur de la case à cocher sélectionnée via la valeur de retour de la fonction.
.get()
: Convertissez la valeur mappée en un type de tableau.
var checkboxes = document.querySelectorAll('input[name="option"]'); var checkedVals = []; for (var i = 0; i < checkboxes.length; i++) { if (checkboxes[i].checked) { checkedVals.push(checkboxes[i].value); } } console.log('选中的值为:' + checkedVals.join(', '));
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!