Struts2与jQuery EasyUI实战技巧-优快云博客

本文介绍Struts2框架与jQuery EasyUI组件库的实际应用技巧，包括Struts2动态方法调用、标签使用及jQuery EasyUI的tabs插件、事件绑定等高级特性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

开始架构遇到的技术：
1 用span标签，id设置为aa
var obj=document.getElementById("aa");
obj.innerText=src;//ok 只是文本
obj.innerHTML=src;//ok
//document.write(src);//ok

2 通过struts2的text标签，可以将后台的值显示在前台（网页能识别类似于js的innerHTML）。而s:property则是把值显示出来（只是将内容显示出来，网页不能识别，类似于js的innerText）。
如：bean.setMenuStr("<script type='text/javascript' language='javascript'>alert('后台')</script>");

前台：
<%@ taglib prefix="s" uri="/struts-tags" %>

<body>
<span id="aa"></span>
<s:text name="bean.menuStr"></s:text>
</body>

查看源文件：
<body>
<span id="aa"></span>
<script type='text/javascript' language='javascript'>alert('后台')</script>
</body>

3 ApplicationContext是应用上下文。是能够读取配置文件中的bean对象的。
创建是通过WebApplicationContextUtils.getWebApplicationContext(servletContext对象)来创建的。这样就能够任意的读取配置文件中的bean对象的。例如就能够读取service对象，然后调用其dao方法，去读取数据库了。
如：private ApplicationContext applicationContext;
ServletContext servletContext=ServletActionContext.getServletContext();
applicationContext=WebApplicationContextUtils.getWebApplicationContext(servletContext);

public Object getBean(String name){
return applicationContext.getBean(name);
}

4 得到ServletContext对象。可以通过ServletActionContext类得到。
如：private ApplicationContext applicationContext;
ServletContext servletContext=ServletActionContext.getServletContext();

5 在spring的配置文件中对action进行配置时，添加bean的属性，如：
<bean name="userAction" class="com.action.UserAction" scope="prototype">
<property name="userService" ref="userService"></property>
<property name="bean" ref="users"></property>
</bean>

添加bean属性，是为了对bean进行实例化（就是new一个对象出来）。如果没添加bean的属性，则在程序制定过程中，bean则为null。

6 在struts2的配置文件中，每个action的name不能重复。不然会出现问题。
如：<action name="userAction" class="userAction" method="login">
<result name="success">/jsp/user/index.jsp</result>
<result name="input">/jsp/user/error.jsp</result>
</action>

<action name="userLeftMenuAction" class="userAction" method="leftMenu">
<result name="success">/jsp/user/left.jsp</result>
<result name="input">/jsp/user/error.jsp</result>
</action>
这两个action的name不能重复

7 在网页中可以使用frameset框架集合。
如：<frameset cols="220,*" framespacing="0" frameborder="no" border="0" name="oa_frame">
<frame src="./userLeftMenuAction!leftMenu" id="leftMenu" name="leftMenu"/>
<frame src="<%=basePath %>jsp/user/content.jsp" id="content" name="content"/>
</frameset>
</script>
<body>
</body>

该框架集合，必须放在body标签的外部。
frame的src可以是jsp的路径，也可以是一个action路径。

8在框架集合中。如果某一个子框架想要调用另一个子框架中的js方法。则可以通过window.parent.frames["子框架的name"].方法名(参数)
如：
<frameset cols="220,*" framespacing="0" frameborder="no" border="0" name="oa_frame">
<frame src="./userLeftMenuAction!leftMenu" id="leftMenu" name="leftMenu"/>
<frame src="<%=basePath %>jsp/user/content.jsp" id="content" name="content"/>
</frameset>
</script>
<body>
</body>

子框架A(name为leftMenu)的js方法想要调用子框架B中的js方法
function li_menu_onclick(menu_class,menu_name){
window.parent.frames["content"].addTabForLeft(menu_class,menu_name);
}

子框架B的name为content
function addTabForLeft(menu_class,menu_name){
alert("ddddd");
}

9 jquery easyui中使用tabs技术，是多个选项tab，如：
添加jquery的必须的css和js:
<link rel="stylesheet" type="text/css" href="<%=basePath%>common/jquery/jquery-easyui-1.3.2/themes/icon.css">
<link rel="stylesheet" type="text/css" href="<%=basePath%>common/jquery/jquery-easyui-1.3.2/themes/default/easyui.css">
<script type="text/javascript" language="javascript" src="<%=basePath%>common/jquery/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>
<script type="text/javascript" language="javascript" src="<%=basePath%>common/jquery/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>

页面添加为jquery的tabs,为了能使用tabs:
<div id="tt" class="easyui-tabs" data-options="tools:'#tab-tools'" style="width:700px;height:250px">
这是jquery会加载jquery.tabs.js和tabs.css

js代码：
添加一个tabs：
var index=0;
function btn_add_onclick(){
index=index+1;
$("#tt").tabs("add",{
title:"tab"+index,
content:"content"+index,
closable:true
});
}

进一步优化：
添加一个tabs时进行判断，如果存在则打开，否则则添加：
function btn_addT_onclick(index_){
var tab_title="tab"+index_;
var flag=$("#tt").tabs("exists",tab_title);//来判断是否已存在
if(flag){//打开
$('#tt').tabs('select',tab_title); //已存在则打开
}else{//新建
}
}

另：jquery easyui中插件的方法的用法：
$("#id").插件('插件的方法'，方法的参数);

如使用tabs插件，用来判断是否存在：
var flag=$("#tt").tabs("exists",tab_title);//id为:tt，插件为:tabs，插件的方法为:exists，方法的参数为:tab_title

有时插件的方法是一个变量或这一个类（类中有多个变量）

10 jquery easyui中插件的事件的用法：事件需要在页面onload时进行添加这些事件
如：$("#id").插件({
事件1名:function(参数..){
事件的处理。。。
}
})

多个事件：
$("#id").插件({
事件1名:function(参数..){
事件的处理。。。
},
事件2名:function(参数..){
事件的处理。。。
}
})

如：tabs的onAdd事件和onClose事件：
<body onload="load()">

js:
function load(){
$("#tt").tabs({
onAdd:function(title){
//alert("add title is:"+title);
tab_index=tab_index+1;
},
onClose:function(title){
//alert("close title is:"+title);
tab_index=tab_index-1;
}
});

}

11 struts2中如何打开了支持动态方法，则在将方法名放在url中或者将方法名配置在struts2的配置文件中是一样的效果。不过将方法名放在url中，扩展性更强。
如：首先打开struts2的支持动态方法：
<constant name="struts.enable.DynamicMethodInvocation" value="true" />

将方法名放在url中：
url=http://localhost:8080/test20150411/userAction!login
方法名是login方法

将方法名配置在struts2的配置文件中：
<action name="userAction" class="userAction" method="login">
<result name="success">/jsp/user/index.jsp</result>
<result name="input">/jsp/user/error.jsp</result>
</action>

所以效果更好的是将方法名放置在url中。配置文件中就不设置method属性了。
url：
http://localhost:8080/test20150411/userAction!login

struts2的配置文件：
<action name="userAction" class="userAction">
<result name="success">/jsp/user/index.jsp</result>
<result name="input">/jsp/user/error.jsp</result>
</action>

struts2会自动识别调用的是login方法。

12 mysql中date_format是将日期格式转化为对应格式的字符串
如：<select id="query" resultClass="example" parameterClass="example">
select id,name,remark,createDate from example where 1=1
<isNotEmpty prepend="and" property="createDateSer">
date_format(createDate,'%Y-%m-%d') <![CDATA[ >= ]]> date_format(#createDateSer#,'%Y-%m-%d')
</isNotEmpty>
</select>

13 在jsp中可以使用EL表达式，${bean.name}可以理解为：<%=request.getAttribute("bean").getName()%>
如：<input type="text" id="bean.creatDateSer" name="bean.createDateSer" class="Wdate" value="${bean.createDateSer}" onfocus="WdatePicker({isShowWeek:true,dateFmt:'yyyy-MM-dd'})"/>

然后bean的createDateSer需要是字符串类型的。

而ONGL表达式中的#request.bean.resultLists中的#表示ServletActionContext.getContext()
ONGL表达式一般用在Struts2标签中。