JavaWeb项目积累问题解决方案,持续更新中

最新推荐文章于 2023-02-07 20:10:27 发布

置顶清澈@Cherry

最新推荐文章于 2023-02-07 20:10:27 发布

阅读量1.5k

点赞数

分类专栏： JavaWeb 文章标签： java web js jquery

本文链接：https://blog.csdn.net/nihaoqiulinhe/article/details/52710901

版权

JavaWeb 专栏收录该内容

73 篇文章 1 订阅

订阅专栏

本文分享了Struts2框架结合jQuery实现的各种实用技巧，包括登录界面Enter键提交、EL表达式使用、DataTable插件复选框操作、JS值传递给Action、居中显示布局等，帮助开发者提高开发效率。

摘要由CSDN通过智能技术生成

饶了一大圈,项目经理觉得没有什么事情可以安排,刚好在外面接了一个外包项目,需要建立一个使用三大框架网站,还是蛮有兴趣的.还记得那时2013年,那时候大三非常彷徨,都不知道学习什么,学校的理论学完了,觉得肯定学不到什么工作,看着同学都去参加培训,觉得自己已经读书,如果还要向家里要钱的话,有点过意不去,所以就开始买了一本书,推荐一下<古乐声的Java Web 程序设计与项目实践>,特别适合入门,感谢这位前辈让我见识到了java的魅力.又回到我大学自学的javaweb,很多东西都忘记了,所以重新做的项目,将遇到的问题都记录下来,以便于自己复习:

　一．想必登陆界面都会想实现输入完账户名和密码，敲击键盘的Enter键,提交表单,如下函数可以实现:

<script>
		jQuery(document).ready(function() {
			
			//按enter键提交表单
			document.onkeydown = function (event){
            if (event.keyCode==13) //回车键的键值为13
            
              var jqForm = $( this).closest( 'form');//拿到最近的submit控件,进行提交
              jqForm.submit();
              
            };
		});
	</script>

不过如果你刚好使用到了百度浏览器或者其他浏览器的记住账号和密码的时候,你发现要按两次enter键才能提交,而IE浏览器并没有这个问题,那是因为记住账号的网站,第一次按Enter键,默认是将出现的记住的下拉账号填充到输入框,也就是会拦截第一次的点击事件.

二,当使用到struct2框架的EL表达式的时候,想要将拿到的对象的一个属性弹出来,但总会弹出错误:如下:Uncaught ReferenceError: qaa is not defined

刚开始以为 alert(${infors[0].name});这样默认EL表达式默认的就是字符串,但发现是无法识别的,需要再加一个双引号:如下:

alert("${infors[0].name}");

三.网站的表格使用的是开源的JQuery dataTables,真的非常强大,不过遇到一个问题,如何添加复选框,获得选中的哪几行,又该如何将这几行从struct2传递的对象数据重新拼接起来,传给action来改变数据库呢,我的思路是:

1.使用struct2的标签,将遍历的list对象的位置赋值给checkbox,以便于在后来遍历选中的状态的行,能取到行数,只要拿得到行数,就可以利用list对象,重新进行拼接,如下代码:

<s:iterator value="infors" id="infor" status="stat">
	<tr class="odd gradeX">
        <td><input type="checkbox" name="everyline" class="checkboxes" value="<s:property value="#stat.index"</span> />" /></td>
		<%-- <td><s:property value="#stat.index" /></td> --%><%--这可以获取表格的序号 --%>
	<td><s:property value="#infor.number" /></td>
	<td><s:property value="#infor.name" /></td>
	<td><s:property value="#infor.retirementCardNo" /></td>
	<td><fmt:formatDate value="${infor.inTime}"

infors是一个list对象集合,value="<s:property value="#stat.index"这句就是去的对象的位置,赋值给复选框,接着点击提交按钮,遍历已经选中的复选框,如下代码:

$(".btn.green").click(function() {
			
                var checkLenght = $("input[type='checkbox']:checked").length;//  alert("长度为"+checkLenght);
			    
		/* $("input[type=checkbox][checked]").each(function(){ //由于复选框一般选中的是多个,所以可以循环输出 
                   alert($(this).val()); //获取到选中的行号
                });  */
	        $("input:checkbox[name=everyline]:checked").each(function(){ //由于复选框一般选中的是多个,所以可以循环输出 
                   alert($(this).val()); //获取到选中的行号
                }); 
			   
			   // alert("${infors[0].name}");
		});

通过上面的方式就可以获得选中的行号,这样就可以从List进行过滤,传递数据了,有更好的办法,可以告诉我,谢谢

四.如何将js网页的值传递给struct2的action,里面,其实只需要在action写一个setter/getter方法,然后在网页,获取表单,将参数加在后面就可以自动获取值,如下:

$(".btn.green").click(function() {		
              
              var listInforSelect="测试是否传给action";
			   
			   $("#forminfor").attr('action','auditProgress.action?listInforSelect='+listInforSelect+ '');  
			    $("#forminfor").submit();
			});

java里面的action代码为:

	private String listInforSelect;

	public String getListInforSelect() {
		return listInforSelect;
	}

	public void setListInforSelect(String listInforSelect) {
		this.listInforSelect = listInforSelect;
	}

	public String audit() {
		System.out.println("是否跳转到这里执行获取选中的数据" + listInforSelect);
		infors = new ArrayList<RetireInfor>();

		inforMgr.update(infors);
		return SUCCESS;
	}

这样就可以将js的值传给action了,中文会有乱码,后续解决吧

五.struts2 使用了标签c,要求文字能居中,可以使用如下方式:

<c:otherwise><p style="text-align: center;">--</p></c:otherwise>

<c:otherwise><p style="text-align: center;">--</p></c:otherwise>

六.项目中,需要将div居中显示,使用以下方式,(IE没有效果),其他浏览器有用:

(1)给div添加对应的class,如下:

<div class=" setdiv_center">
</div>

然后在css文件中,添加如下代码,便可居中:

.setdiv_center{
	margin-left:50%;  <pre name="code" class="plain">

7.JQuery datatables插件中,设置某些列不能排序:

datatable是一个jquery扩展的表格插件。其提供了强大的表格功能。
官方地址：http://www.datatables.net/media/images/DataTables.jpg
 
在官方示例中，对于表格的是否可排序是在初始化中设置的一个值来决定的
Js代码  收藏代码
$(".datatable-simplified").dataTable( {  
        "bSort": false  
});  
 
如果要在初始化时就指定默认以哪一列来排序则
Js代码  收藏代码
$(document).ready(function() {  
    $('#example').dataTable( {  
        "aaSorting": [[ 4, "desc" ]]  
    } );  
} );  
 这会在页面加载时初始化表格，并以序号为4也就是第5列进行降序排列
 
不过，这种设置只能是对表头的所有列一起进行设置。要么全都可排序，要么全都不可排序。
现有一需求，第一列为checkbox，要其不可排序，其余列均可排序
 
经过研究后，发现有一配置可解决该问题。在初始化时设置以下值
 
Js代码  收藏代码
$(".datatable").dataTable( {  
        "aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0 ] }]  
    });  
 该值的含义为。初始化datatable，但对序号为0列的列不进行排序，别的列均可进行排序

后面是数组，可以是多列
"aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0 , 1 , 2 ] }]

left:400; }

8.在jsp页面外的js里面获取EL表达式的值:餐卡欧如下博文:

JS中如何获取到EL表达式的值?

原先做法是在jsp页面引入头文件

<%@ page language="java" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<c:set var="ctxStatic" value="${pageContext.request.contextPath}/static" />
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

然后在js文件里头使用使用${ctx}，结果是直接输出，并没有被解析出来。

因为是js代码是单独出来的文件，然后引入到jsp页面。现在我们可以提前在jsp页面定义js的全局变量来解决。

然后我们在引入的js代码中就可以直接使用ctx，轻松获取到所需的值。

9.js中的日期比较函数:

//日期比较函数,false则开始时间大于结束时间,返回false
function compareDate(date, lastdate) {
	var beginDate = date + "-01";
	var endDate = lastdate + "-01";
	var d1 = new Date(beginDate.replace(/\-/g, "\/"));
	var d2 = new Date(endDate.replace(/\-/g, "\/"));
	if (d1 >= d2) {
		return false;
	}
	return true;
}