Java項目在jsp頁面中引入jquery架構的步驟

來源:互聯網
上載者:User

標籤:tin   nbsp   type   myeclips   path   desc   function   java項目   server   

環境:在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輕鬆的獲得對象的值.

 

Java項目在jsp頁面中引入jquery架構的步驟

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.