说明
在优化功能时，需要使用js脚本控制文本框只能输入-1或大于0的整数，并且使用jQuery获取复选框的值，并将获取的值以key-value的形式以List <Map<String,String>>的形式提交的后台。这里的需求是商品id和商品对应的有效期validtime提交到后台，有效期默认为-1，可手动填写但是必须是大于0的整数且不能超过5位数。找了挺多的资料，在这里记录下实现的过程。
正文
源代码
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<base href="<%=basePath %>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
// 检查输入框中只能输入-1或大于0的整数
function checkNum(txt){
var num;
if(txt.value.toString().indexOf(".") != -1){
num = "-1";
} else if(Number(txt.value) <= -1){
num = "-1";
} else if (Number(txt.value) == 0) {
num = "-1";
} else if (txt.value.length > 0) {
if(isNaN(txt.value)){
num = "-1";
}else{
num = Number(txt.value);
}
} else {
num = "";
}
if(num == ""){
num = "-1";
}
txt.value=num;
}
//jQuery 遍历复选框 并且合成要求格式List<Map<String,String>>的数据
function getChecked(){
var arrList = new Array();
var res = new Array();
var arrChk = $("input[name = 'checkbox']:checked");
$(arrChk).each(function(){
var map = new Map();
var gid = $(this).val();
var validtime = $("#"+gid).val();
map["goodsId"] = gid;
map["validtime"] = validtime;
res.push(map);
arrList.push(this.value);
});
if(arrList.lenght == 0){
alert("数据没有选中");
return;
}
//使用ajax提交数据 ...
}
</script>
</head>
<body>
<table>
<tr>
<td><input type="checkbox" name="chk_all" id="chk_all" value=""></td>
<td>商品编号</td>
<td>商品有效期</td>
</tr>
<c:forEach var="value" items="${list}" varStatus="status">
<tr>
<td><input type="checkbox" name="chk_list" id="chk_list_${status.index}" value="${value.goods_id}"></td>
<td>${value.goods_id}</td>
<td><input type="text" name="valid_time" id="${value.goods_id}" value="-1" maxlength="5" onblur="checkNum(this)"/></td>
</tr>
</c:forEach>
</table>
</body>
</html>正则表达式校验数据
//强制输入框只能输入大于1的正整数
function checkNum(txt) {
var num;
if (txt.value.length == 1) {
num = txt.value.replace(/[^1-9]/g, '');
} else if (txt.value.length > 1) {
num = txt.value.replace(/\D/g, '');
} else {
num = 1;
}
txt.value=num;
}