jQuery使用load函数访问Struts2中的Action实现局部刷新和注册事件

发布于 2011-05-28 | 更新于 2020-09-20

使用jQuery的load事件时,调用的具体格式为:

load( url, [data], [callback] )

具体参数的含义如下:

url (String): 装入页面的URL地址 params (Map): (可选)发送到服务端的键/值对参数,传递参数的格式为:{“ID”: id } callback (Function): (可选) 当数据装入完成时执行的函数

其中Function包含的参数如下:

function (responseText, textStatus, XMLHttpRequest) {}

responseText代表请求返回的内容 textStatus代表请求的状态,其值可能为:success,error,notmodify,timeout 4种 XMLHttpRequest对象

下面是一个使用load事件的例子,这个例子在页面加载

时自动触发load方法,load方法对应的三个参数分别为: url:调用Ajax请求,这里是请求访问服务器端的 admin/Share-getQuestionList.action params:这个是可选参数,这里没有给出 callback:回调函数function(responseText,textStatus,XMLHttpRequest),把返回的数据加入div中。

HTML代码:

jQuery代码:

$(“.index_question_div”).load(“admin/Share-getQuestionList.action”, function(responseText,textStatus,XMLHttpRequest) {
$(“.index_question_div”).html(responseText);
$(“.index_question_div”).fadeIn(“slow”);

$('.question_unit').hover(function(event){
	$(this).addClass('question_unit_select');
},function(){
	$(this).removeClass('question_unit_select');
});

$('.read_more_arrow').hover(function(event){
	$(this).addClass('read_more_arrow_hover2');
},function(){
	$(this).removeClass('read_more_arrow_hover2');
});

$('.read_more_arrow').click(function(event){
	$(this).next().slideToggle("slow");
});

});

这个例子中服务端返回的responseText为:

<s:iterator value=“questions” var=“q”>



<img src=“<s:property value=”#q.questionUploader.userPhoto"/>" class=“unit_photo_img” />




<s:property value=“#q.questionContent”/>

<s:property value=“#q.questionTime”/>




<s:property value=“#q.questionUploader.userName”/>




</s:iterator>

注意这里使用load局部刷新获取的元素的事件只能在 $(“.index_question_div”).html(responseText); 之后加载,在这之前加载是无效的,加载的元素必须重新注册自己的事件处理程序。

本文作者: arthinking

本文链接: https://www.itzhai.comstruts2-using-the-load-function-to-access-jquery-in-action-to-achieve-partial-refresh-and-up-event.html

版权声明: 版权归作者所有,未经许可不得转载,侵权必究!联系作者请加公众号。

×
IT宅

关注公众号及时获取网站内容更新。