原來(lái)Jquery.load的方法可以一直load下去
更新時(shí)間：2011年03月28日 22:45:21 作者：
使用jQuery.load方法加載一個(gè)網(wǎng)頁(yè)，那么這個(gè)網(wǎng)頁(yè)內(nèi)部的js代碼是否能夠執(zhí)行呢，答案是肯定的，這就相當(dāng)于把load的內(nèi)容與主頁(yè)面進(jìn)行了合并一樣
只要不沖突（例如id不能一樣），我寫(xiě)了一個(gè)例子，利用頁(yè)面參數(shù)控制內(nèi)部的元素id，互相加載自己。這是一個(gè)jsp頁(yè)面，代碼如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
int i = Integer.parseInt(request.getParameter("i")==null?"0":request.getParameter("i"));
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>用戶登錄</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">
<script type="text/javascript" src="<%=path%>/Scripts/jquery-1.5.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#h<%= i %>").click(function(){
$("#d<%= i %>").load("<%=basePath%>index.jsp",{i:<%=i+1%>});
});
});
</script>
</head>
<body>
this is index.jsp?i=<%= i %>
<input type="button" value="get<%= i+1 %>" id="h<%= i %>">
<br>
<div id="d<%= i %>" style="border:1px; border-style: solid; margin: 5px;">load index.jsp?i=<%= i+1 %> here!</div>
</body>
</html>
$("#d<%= i %>").load("<%=basePath%>Login.action input",{i:<%=i+1%>});
復(fù)制代碼 代碼如下:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
int i = Integer.parseInt(request.getParameter("i")==null?"0":request.getParameter("i"));
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>用戶登錄</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">
<script type="text/javascript" src="<%=path%>/Scripts/jquery-1.5.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#h<%= i %>").click(function(){
$("#d<%= i %>").load("<%=basePath%>index.jsp",{i:<%=i+1%>});
});
});
</script>
</head>
<body>
this is index.jsp?i=<%= i %>
<input type="button" value="get<%= i+1 %>" id="h<%= i %>">
<br>
<div id="d<%= i %>" style="border:1px; border-style: solid; margin: 5px;">load index.jsp?i=<%= i+1 %> here!</div>
</body>
</html>
運(yùn)行后如圖所示，可以一直點(diǎn)下去：
但是，如果你只取的是頁(yè)面的一部分，例如將按鈕的點(diǎn)擊代碼改成：
復(fù)制代碼 代碼如下:
$("#d<%= i %>").load("<%=basePath%>Login.action input",{i:<%=i+1%>});
那么，加載的就只是一個(gè)按鈕了，而不是整個(gè)頁(yè)面。如圖：
相關(guān)文章
jQuery實(shí)現(xiàn)統(tǒng)計(jì)復(fù)選框選中數(shù)量
這里給大家分享一段jQuery實(shí)現(xiàn)的統(tǒng)計(jì)復(fù)選框選中數(shù)量的代碼，非常的實(shí)用，有需要的小伙伴們請(qǐng)帶走！2014-11-11
jquery mobile 實(shí)現(xiàn)自定義confirm確認(rèn)框效果的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇jquery mobile 實(shí)現(xiàn)自定義confirm確認(rèn)框效果的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-06-06
這篇文章主要介紹了jquery中ajax處理跨域的三大方式，感興趣的小伙伴們可以參考一下2016-01-01
使用jQuery判斷Div是否在可視區(qū)域的方法 判斷div是否可見(jiàn)
這篇文章主要介紹了使用jQuery判斷Div是否在可視區(qū)域的方法 判斷div是否可見(jiàn)2016-02-02
利用jQuery的$.event.fix函數(shù)統(tǒng)一瀏覽器event事件處理
做WEB前端開(kāi)發(fā)的人都知道不同的瀏覽器對(duì)事件的處理方式是有區(qū)別的。2009-12-12
jQuery綁定事件-多種實(shí)現(xiàn)方式總結(jié)
下面小編就為大家?guī)?lái)一篇jQuery綁定事件-多種實(shí)現(xiàn)方式總結(jié)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考2016-05-05
jQuery實(shí)現(xiàn)簡(jiǎn)單彈窗遮罩效果
本文主要介紹了jquery實(shí)現(xiàn)簡(jiǎn)單彈窗遮罩效果的實(shí)例，具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-02-02
jQuery實(shí)現(xiàn)分隔條左右拖動(dòng)功能
這篇文章主要介紹了jQuery實(shí)現(xiàn)分隔條左右拖動(dòng)功能，需要的朋友可以參考下2015-11-11
文本框水印提示效果的簡(jiǎn)單實(shí)現(xiàn)代碼
本篇文章主要是對(duì)文本框水印提示效果的簡(jiǎn)單實(shí)現(xiàn)代碼進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-02-02
下面小編就為大家分享一篇jQuery封裝animate.css的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-01-01