Maison > interface Web > Questions et réponses frontales > Comment utiliser jQuery pour déterminer l'exactitude des réponses

Comment utiliser jQuery pour déterminer l'exactitude des réponses

PHPz
Libérer: 2023-04-07 14:41:42
original
603 Les gens l'ont consulté

jQuery est une bibliothèque JavaScript largement utilisée dans le développement Web. Elle dispose de sélecteurs pratiques et de méthodes de fonctionnement rapides, permettant aux développeurs d'effectuer les tâches de développement Web plus efficacement. Dans le développement Web, il est souvent nécessaire que les utilisateurs sélectionnent les réponses aux questions, puis jugent si les réponses de l'utilisateur sont bonnes ou fausses. Cet article explique comment utiliser jQuery pour juger de l'exactitude des réponses.

Étape 1 : Créer un fichier HTML

Tout d'abord, créez un fichier HTML dans le dossier souhaité, nommez-le index.html et ajoutez une référence à la bibliothèque jQuery en tête du fichier comme suit :

nbsp;html>


    <meta>
    <title>jQueryComment utiliser jQuery pour déterminer lexactitude des réponses</title>
    <script></script>


    <h1>请回答以下问题:</h1>
    <p>1. 世界上最高的山峰是哪座?</p>
    <input>A. 珠穆朗玛峰<br>
    <input>B. 布达拉宫<br>
    <input>C. 长城<br>
    <br>
    <p>2. 水的化学式是什么?</p>
    <input>A. H2O<br>
    <input>B. CO2<br>
    <input>C. O2<br>
    <br>
    <button>提交</button>
    <br>
    <br>
    <p></p>
    <script></script>

Copier après la connexion

Le fichier contient Deux questions et trois options, chaque valeur d'option est la lettre A, B, C. Ajoutez un bouton de soumission et un paragraphe de texte vide au bas de la page pour fournir des commentaires à l'utilisateur sur l'exactitude de la réponse.

Étape 2 : Créer un fichier JavaScript

Deuxièmement, créez un fichier JavaScript dans le dossier requis, nommé index.js. Ce fichier contient le code principal de jQuery pour déterminer l'exactitude de la réponse.

$(document).ready(function(){
    $("#submit").click(function(){
        var q1=$("input[name='question1']:checked").val();
        var q2=$("input[name='question2']:checked").val();
        var result="";
        if(q1=="A"){
            result+="问题一回答正确;";
        }
        else{
            result+="问题一回答错误;";
        }
        if(q2=="A"){
            result+="问题二回答正确;";
        }
        else{
            result+="问题二回答错误;";
        }
        $("#result").text(result);
    });
});
Copier après la connexion

Le fichier utilise d'abord la méthode $(document).ready() pour garantir que le code suivant ne peut être exécuté qu'après le chargement de la page.

Ensuite, utilisez la méthode $("#submit").click() pour définir l'événement de clic pour le bouton de soumission Lorsque l'utilisateur clique sur le bouton de soumission, les valeurs d'option de la question 1 et de la question 2 seront obtenues. .

Après cela, utilisez l'instruction if-else pour déterminer si la réponse sélectionnée par l'utilisateur est correcte. Si la valeur de l'option est la lettre A, la réponse est déterminée comme étant correcte, sinon la réponse est déterminée comme étant incorrecte.

Enfin, utilisez la méthode $("#result").text(result) pour afficher le résultat du jugement dans un paragraphe de texte vide.

Étape 3 : Exécutez le code

Exécutez le fichier index.html pour juger si la réponse à la question est bonne ou fausse, et affichez le résultat du jugement dans un paragraphe de texte vide, comme indiqué ci-dessous :

Comment utiliser jQuery pour déterminer lexactitude des réponses

Résumé :

Introduction à cet article Apprenez à utiliser jQuery pour déterminer l'exactitude des réponses. En créant des fichiers HTML et des fichiers JavaScript, et en utilisant des sélecteurs et des déclarations de jugement, le processus de sélection et de jugement des réponses aux questions par l'utilisateur est réalisé, offrant ainsi une méthode de mise en œuvre pratique et rapide pour les développeurs Web.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal