文本續上一篇
學會了使用 webjars 後。
本文說明一下jQuery設定。
一、引用 jQuery
pom.xml -> dependency
加入 jquery及jquery-ui
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery-ui</artifactId>
<version>1.13.0</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.6.0</version>
</dependency>
圖1
二、範例及測試
內容範例來源
https://cdn.jsdelivr.net/webjars/org.webjars/jquery-ui/1.13.0/index.html
圖2
圖2-1 在 jquery-ui jar 也可以找到
本專案在static資料夾下，新增jquery資料夾，新增jquery-ui-example.html
圖3
在head加入以下：
<script src="/webjars/jquery/jquery.min.js"></script>
<script src="/webjars/jquery-ui/jquery-ui.js"></script>
<link href="/webjars/jquery-ui/jquery-ui.css" rel="stylesheet">
圖4 執行 http://localhost:8080/jquery/jquery-ui-example.html
看到
圖5 看到Dialog 及 Datepicker 效果還不錯吧!
以上就簡單說明jquery及jquery-ui的設定。
如何使用呢?可以看看範例程式。
以後在文章中有使用到會說明。
用LINE傳送分享
其它文章
沒有留言:
張貼留言