一般方式和ajax方式從後臺獲取資料載入進網頁
1,普通方法無非就是先訪問相應servlet拿到資料,存到request域中,跳轉到jsp頁面,通過jsp標籤遍歷拿到資料,前面的文章提到了點選開啟連結。
2,若想通過某些規則校驗表單資料,沒有訪問資料庫,jquery是你不二選擇,點選跳轉到jquery表單校驗外掛
3,通過ajax獲取後臺資訊
拿購物網站為例,購物網站的導航欄是通用的,一般都是獨立的jsp頁面。新建一個head.jsp頁面,由於是被包含,所以不用加入jquery外掛,通過ajax非同步訪問後臺,後臺拿到資料庫的資料是List集合,通過Gson工具將List轉化為Json字串返回給ajax引擎,通過指令碼js動態將資料加入前臺頁面,使用前要匯入Gson的jar包
head.jsp程式碼
<script type="text/javascript">
$(function(){
var content ="";
$.post(
"${pageContext.request.contextPath}/categoryList",
function(data){
for(var i = 0; i < data.length; i++){
content +="<li><a href='#'>" +data[i].cname+"</a></li>"
}
$("#categoryListUl").html(content);
},
"json"
)
})
</script>
servlet程式碼
ProductService service = new ProductService();
List<Category> category = service.findCategory();
Gson gson = new Gson();
String s = gson.toJson(category);
response.setContentType("text/html;charset=utf-8");
response.getWriter().write(s);
ajax各引數詳情
1)$.get(url, [data], [callback], [type])
2)$.post(url, [data], [callback], [type])
其中:
url:代表請求的伺服器端地址
data:代表請求伺服器端的資料(可以是key=value形式也可以是json格式)
callback:表示伺服器端成功響應所觸發的函式(只有正常成功返回才執行)
type:表示伺服器端返回的資料型別(jquery會根據指定的型別自動型別轉換)
常用的返回型別:text、json、html等
3)$.ajax( { option1:value1,option2:value2... } );
常用的option有如下:
async:是否非同步,預設是true代表非同步
data:傳送到伺服器的引數,建議使用json格式
dataType:伺服器端返回的資料型別,常用text和json
success:成功響應執行的函式,對應的型別是function型別
type:請求方式,POST/GET
url:請求伺服器端地址