Maison  >  Article  >  interface Web  >  jsp ne peut pas utiliser jquery

jsp ne peut pas utiliser jquery

WBOY
WBOYoriginal
2023-05-12 10:09:36740parcourir

C'est un problème courant que JSP ne puisse pas utiliser jQuery. De nombreux débutants rencontrent souvent ce problème lorsqu'ils utilisent JSP. Étant donné que JSP est une technologie de page Web dynamique écrite en langage Java et que jQuery est une bibliothèque basée sur JavaScript, il existe certaines différences entre les deux. Cet article explique pourquoi JSP ne peut pas utiliser jQuery et comment résoudre ce problème.

1. Raisons pour lesquelles JSP ne peut pas utiliser jQuery

Vous pouvez utiliser JavaScript pour écrire des scripts dans JSP, mais vous ne pouvez pas utiliser directement jQuery. En effet, JSP générera un programme Servlet après la compilation et jQuery est une bibliothèque JavaScript qui doit être interprétée et exécutée dans le navigateur. Par conséquent, si vous placez une référence jQuery dans une page JSP, cela provoquera une erreur de compilation car la syntaxe de jQuery ne peut pas être reconnue côté serveur.

2. Solution

1. Référencez la bibliothèque jQuery dans la page JSP

Pour utiliser jQuery dans la page JSP, nous devons introduire la bibliothèque jQuery dans la JSP. Ceci peut être réalisé des deux manières suivantes :

(1) Référencez la bibliothèque jQuery en ligne

Vous pouvez ajouter le code suivant à la page JSP :

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

Ce code téléchargera la bibliothèque jQuery depuis le site officiel de jQuery et présentera dans la page JSP. Cette méthode est très simple, mais elle nécessite de télécharger la bibliothèque jQuery depuis le serveur distant à chaque chargement de la page, ce qui peut affecter la vitesse de chargement de la page.

(2) Référencez localement la bibliothèque jQuery

Vous pouvez télécharger la bibliothèque jQuery localement et la référencer dans la page JSP. Vous pouvez le faire en suivant les étapes suivantes :

①Visitez le site officiel de jQuery (https://jquery.com). ) et téléchargez la dernière version de la bibliothèque jQuery.

②Placez le fichier jQuery téléchargé dans un répertoire spécifié du projet (tel que le répertoire "js").

③Référencez la bibliothèque jQuery locale dans la page JSP. L'exemple de code est le suivant :

<script src="${pageContext.request.contextPath}/js/jquery-3.6.0.min.js"></script>

Ce code introduit la bibliothèque jQuery locale dans la page JSP. Parmi eux, ${pageContext.request.contextPath} représente le chemin du répertoire racine de l'application Web actuelle.

2. Utiliser la bibliothèque de balises JSTL

JSTL (JavaServer Pages Standard Tag Library) est un type de bibliothèque de balises JSP qui peut facilement appeler des objets Java, exécuter des jugements conditionnels, des structures de boucles, etc. JSTL fournit également des balises qui peuvent être utilisées pour implémenter des fonctions similaires à jQuery. Par exemple : vous pouvez utiliser la balise d0d9bdab4076eea66045fa63123be3ee pour implémenter un jugement conditionnel, la balise 8f86ca20bf479ad0d2cad5e574c19d8a pour parcourir la collection, etc. Ces balises peuvent être utilisées avec JavaScript pour obtenir des effets de type jQuery.

Par exemple, nous pouvons implémenter une fonction de délégation d'événements similaire à jQuery via le code suivant :

<c:forEach items="${persons}" var="p">
    <tr>
        <td>${p.id}</td>
        <td>${p.name}</td>
        <td>${p.age}</td>
        <td><button id="delBtn-${p.id}" class="delBtn">删除</button></td>
    </tr>
</c:forEach>

<script>
  $(".delBtn").on("click", function() {
      var btnId = $(this).attr("id");
      var id = btnId.split("-")[1];
      if (confirm("确定删除该条记录?")) {
          window.location.href = "deletePerson.jsp?id=" + id;
      }
  });
</script>

Le code ci-dessus utilise la balise 8f86ca20bf479ad0d2cad5e574c19d8a . Lorsque l'utilisateur clique sur le bouton Supprimer, JavaScript est utilisé pour obtenir l'ID du bouton, extraire l'ID de l'enregistrement à supprimer et accéder à la page deletePerson.jsp pour l'opération de suppression. L'événement click et la méthode attr similaires à jQuery sont utilisés ici.

Étant donné que JSP ne peut pas utiliser directement jQuery, nous devons implémenter des fonctions similaires à jQuery en introduisant la bibliothèque jQuery ou en utilisant la bibliothèque de balises JSTL. Lorsque vous l'utilisez, vous devez bien comprendre les différences et les connexions entre JSP et JavaScript afin de mener à bien le travail de développement.

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!

Déclaration:
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
Article précédent:nodejs installer vueArticle suivant:nodejs installer vue