Java项目在jsp页面中引入jquery框架的步骤

环境:在Java  web项目中引入juqery框架

工具:MyEclipse8.5

[步骤如下]

A:新建一个Java web项目TestJquery,在WebRoot目录下创建一个jquery文件夹

B:下载jquery-1.8.3.min.js放入jquery文件夹中

C:创建jsp页面

<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">

    <title>My JSP ‘test.jsp‘ starting page</title>

    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->

  </head>
  <script  src="jquery/jquery-1.8.3.min.js">//引入jquery框架
  </script>
  <script type="text/javascript">
   function testjquery()
   {
    var user_name=$("#test").attr("value");
    alert(user_name);
    }
  </script>
  <body>
  <input id="test" value="jquery">
  <input type="button" value="click me!" onclick="testjquery();">
  </body>
</html>

  

ps:jquery引入路径解释:jquery/jquery-1.8.3.min.js以当前页面test.jsp为坐标在当前文件夹中查找,由于test.jsp和jquery文件夹都在webroot目录下所以不需要

‘/‘,如果加‘/‘意思是从项目根目录查找

D:发布项目,查看test.jsp

可以看到点击按钮 click me !可以取到文本框的值

因为

文本框取值用了jquery的语法$("#test").attr("value"); test是文本框的id

所以

在此jsp页面中jquery框架引入成功

ps:juqery框架可以根据对象id轻松的获得对象的值.

时间: 2024-07-31 14:29:25

Java项目在jsp页面中引入jquery框架的步骤的相关文章

JSP页面中引入另一个JSP页面

一个JSP页面中引入另一个JSP页面,相当于把另一个JSP页面的内容复制到对应位置: <%@include file="date.jsp" %> 一般页面的top和bottom固定的时候可以用这种方式 原文地址:https://www.cnblogs.com/suhfj-825/p/8214929.html

SpringMVC框架下实现JSON(类方法中回传数据到jsp页面,使用jQuery方法回传)

JSON的实现,即将需要的数据回传到jsp页面: 1>.加入实现Json的三个架包到lib中:2>.目标方法上边加入注解,需要返回的值3>.在jsp页面中书写jQuery方法: eclipse中javaEE环境下的web.xml文件配置为: <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema

JSP页面中使用JSTL标签出现无法解析问题解决办法

今天建立一个JavaWeb工程测试JNDI数据源连接,在jsp页面中引入了JSLT标签库,代码如下: 1<%@ page language="java"import="java.util.*"pageEncoding="UTF-8"%> 2<%@ taglib uri="http://java.sun.com/jsp/jstl/core"prefix="c"%> 3<%@ ta

在jsp页面中添加富文本编译器(ueditor)+ 图片上传功能

一次老大让我把文本的编辑区域加一个富文本编译器,于是马上下载了一个kindEditor来试试,但后来老大推荐说百度的ueditor编译器不错,于是我便怀着扩展知识,又学到一个新东西的心理下载了百度的ueidtor编译器,整合到项目中感觉确实不错,今天就和大家分享下这个富文本编译器的使用-- 第一步:首先下载ueditor编译器,地址:http://ueditor.baidu.com/website/ 下载完解压之后就这个: 第二步:我会把文件名utf-8-jsp这个文件名改为ueditor,然后

jQuery 获取jsp页面中用iframe引入的jsp页面中的值

<iframe scrolling="no" src="<c:url value='/unitBaseperson/view.do?para=9&op=send&type=xls'/>" id="main" frameborder="0" width="400"></iframe> <!--在a.jsp页面中--> 假如我的jsp页面包含这样一

Java与Flex学习笔记(20)---将flex页面嵌入到jsp页面中

如果我们只需要用到Flex的一部分功能,例如播放器功能,我们可以单独把Flex页面嵌入到Jsp页面中.要想实现此功能,需要下载一个工程,将其覆盖在服务器根目录下即可.你可以在次下载:FlexModule_j2ee.zip. 在eclipse下新建一个web工程,将刚才下载的工程解压缩,然后将webtier文件夹下的内容覆盖服务器根目录下,如本人的: 注意要将lib文件夹和jars文件夹下的jar包添加到到类路径下,这样就算是整合完成了吧. 接着新建一个flex的mxml文件PlayVideo.m

Jsp页面中动态的引入另一个jsp,jsp:include路径是变量的实现

1 问题描述 在页面搭建时,会有这样的需求,希望局部页面动态的引用另一个jsp.这里的"动态"的意思引用的jsp的路径是个变量.举个例子,我们希望局部页面可能是page1.jsp或者是page2.jsp. 2 解决方案 2.1 解决方案描述 我使用的是jsp动态导入的技术实现的.动态导入的代码如下.本文的重点是讨论文件的url,能不能是个变量?<jsp:include page="文件的url" flush="true"/> 答案是可

tomcat work目录的作用就是编译每个项目里的jsp文件为java文件如果项目没有jsp页面则这个项目文件夹为空

最近发现,很多网友喜欢把tomcat的work目录里的东西叫做缓存,其实那不是很恰当,work目录只是tomcat的工作目录,也就是tomcat把jsp转换为class文件的工作目录,这也正是为什么它叫work目录而不是cache目录的原因. jsp,tomcat的工作原理是当浏览器访问某个jsp页面时,tomcat会在work目录里把这个jsp页面转换成.java文件,比如将index.jsp转换为index_jsp.java文件,而后编译为index_jsp.class文件,最后tomcat

裴东辉-在jsp页面中使用&lt;%!%&gt;写java方法

<%!%>是声明标签 因为Jsp页在到tomcat的时候会被编译为java文件 jsp页面里面的所有东西都会包含在一个方法里 如果不用声明标签去声明这是个方法 就会报错了 因为方法里面不能有方法 裴东辉-在jsp页面中使用<%!%>写java方法