>  기사  >  웹 프론트엔드  >  jsp에서는 jquery를 사용할 수 없습니다.

jsp에서는 jquery를 사용할 수 없습니다.

WBOY
WBOY원래의
2023-05-12 10:09:36740검색

JSP에서 jQuery를 사용할 수 없는 것은 일반적인 문제입니다. 많은 초보자들이 JSP를 사용할 때 이 문제에 자주 직면합니다. JSP는 Java 언어로 작성된 동적 웹 페이지 기술이고 jQuery는 JavaScript 기반 라이브러리이므로 둘 사이에는 일정한 차이가 있습니다. 이 글에서는 JSP가 jQuery를 사용할 수 없는 이유와 이 문제를 해결하는 방법을 살펴보겠습니다.

1. JSP가 jQuery를 사용할 수 없는 이유

JSP에서 스크립트를 작성하려면 JavaScript를 사용할 수 있지만 jQuery를 직접 사용할 수는 없습니다. JSP는 컴파일 후 서블릿 프로그램을 생성하는데, jQuery는 브라우저에서 해석하고 실행해야 하는 JavaScript 라이브러리이기 때문입니다. 따라서 JSP 페이지에 jQuery 참조를 배치하면 서버 측에서 jQuery의 구문을 인식할 수 없기 때문에 컴파일 오류가 발생합니다.

2. 해결 방법

1. JSP 페이지에서 jQuery 라이브러리를 참조하세요

JSP 페이지에서 jQuery를 사용하려면 JSP에 jQuery 라이브러리를 도입해야 합니다. 이는 다음 두 가지 방법으로 달성할 수 있습니다.

(1) 온라인에서 jQuery 라이브러리 참조

JSP 페이지에 다음 코드를 추가할 수 있습니다.

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

이 코드는 jQuery 공식 웹사이트에서 jQuery 라이브러리를 다운로드하여 소개합니다. JSP 페이지에 넣으세요. 이 방법은 매우 간단하지만 페이지가 로드될 때마다 원격 서버에서 jQuery 라이브러리를 다운로드해야 하므로 페이지 로딩 속도에 영향을 줄 수 있습니다.

(2) jQuery 라이브러리 로컬 참조

jQuery 라이브러리를 로컬로 다운로드하여 JSP 페이지에서 참조할 수 있습니다.

①jQuery 공식 웹사이트(https://jquery.com)를 방문하세요. ) 최신 버전의 jQuery 라이브러리를 다운로드하세요.

②다운로드한 jQuery 파일을 프로젝트의 지정된 디렉터리(예: "js" 디렉터리)에 넣습니다.

3JSP 페이지에서 로컬 jQuery 라이브러리를 참조합니다. 샘플 코드는 다음과 같습니다.

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

이 코드는 JSP 페이지에 로컬 jQuery 라이브러리를 소개합니다. 그 중 ${pageContext.request.contextPath}는 현재 웹 애플리케이션의 루트 디렉터리 경로를 나타냅니다.

2. JSTL 태그 라이브러리 사용

JSTL(JavaServer Pages Standard Tag Library)은 JSP에서 Java 객체 호출, 조건 판단 실행, 루프 구조 등을 쉽게 수행할 수 있는 JSP 태그 라이브러리의 일종입니다. JSTL은 jQuery와 유사한 기능을 구현하는 데 사용할 수 있는 몇 가지 태그도 제공합니다. 예를 들어 d0d9bdab4076eea66045fa63123be3ee 태그를 사용하여 조건부 판단을 구현하고 8f86ca20bf479ad0d2cad5e574c19d8a 태그를 사용하여 컬렉션을 탐색할 수 있습니다. 이러한 태그를 JavaScript와 함께 사용하면 jQuery와 유사한 효과를 얻을 수 있습니다.

예를 들어 다음 코드를 통해 jQuery와 유사한 이벤트 위임 기능을 구현할 수 있습니다.

<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>

위 코드는 8f86ca20bf479ad0d2cad5e574c19d8a 태그를 사용하여 person 컬렉션을 탐색하고 테이블을 생성하며 삭제 버튼을 추가합니다. . 사용자가 삭제 버튼을 클릭하면 JavaScript를 사용하여 버튼 ID를 획득하고 삭제할 레코드의 ID를 추출한 후 삭제 작업을 위해 deletePerson.jsp 페이지로 이동합니다. 여기에서는 jQuery와 유사한 click 이벤트 및 attr 메소드가 사용됩니다.

JSP에서는 jQuery를 직접 사용할 수 없기 때문에 jQuery 라이브러리를 도입하거나 JSTL 태그 라이브러리를 사용하여 jQuery와 유사한 기능을 구현해야 합니다. 이를 사용할 때 개발 작업을 성공적으로 완료하려면 JSP와 JavaScript의 차이점과 연결을 완전히 이해해야 합니다.

위 내용은 jsp에서는 jquery를 사용할 수 없습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:nodejs 설치 vue다음 기사:nodejs 설치 vue