您的位置:首页 > Web前端 > JQuery

Web jquery ajax,EL遍历 js刷新 jquery遍历json数组填充表格 等等随笔

2016-03-31 15:18 786 查看
1.ajaX 局部刷新

type- 请求的类型   url- 地址  data- 参数多的话用逗号隔开

在使用 jquery之前先添加:<script type="text/javascript" src="<%=basePath%>js/jquery-1.7.2.min.js"></script>

function addProjetName(){
var projectName = $("#text_projectName").val();
$.ajax({
type : "POST",  //提交方式
url:"/IS/project/add-project.html",
data : {  //参数
"projectName" : projectName
},
success : function(result) {//返回数据根据结果进行相应的处理
if ( result == "Y" ) {
$(".add_project , .bg").hide();
location.reload(true) //刷新
} else {
alert("添加失败");
}
}
});
}


调用:

<div><a href="javascript:" onclick="addProjetName()">添加</a></div>


2.使用EL表达c:foreach 是遍历之前要在jsp页面最顶端添加

<%@taglib  prefix="c"   uri="http://java.sun.com/jsp/jstl/core" %>

<c:forEach items="${list}" var="u" varStatus="status">
<tr >
<td>${ status.index + 1}</td> <!-- 序列 -->
<td>${u.projectName}</td>
<td><a href="index-list.html">${u.effectiveNum+u.invalidNum}</a></td>
<td><a href="javascript:">${u.effectiveNum}</a></td>
<td><a href="javascript:">${u.invalidNum}</a></td>
<td>${u.recorder}</td>
<td>${u.registTimeStr}</td>
</tr>
</c:forEach>




序列号:怎么获得?

 <c:forEach items="${list}" var="u" varStatus="status">

varStatus 是从0开始的所以序列号 就是 status.index+1

3.js刷新整个界面 ==F5:

 location.reload(true) //刷新

 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新")

4.jquery 遍历:

方法一:

$(selector).each(function(index,element));

index 选择器index的位置,element 当前的元素(也可使用 "this" 选择器)。

var json =[{"name":"张家伟","password":"123456"},{"name":"我推天下","password":"0000量"}];
//下面使用each进行遍历
$.each(json,function(i,item) {
alert(i+' '+item.name+''+item.password);
});
方法二: 

var json =[{"name":"王小姐","address":""}];
for(var i=0,l=json.length;i<l;i++){
for(var key in json[i]){
alert(key+’:'+json[i][key]);
}
}
 方法三:
var json =[{"name":"王小姐","address":""}];
遍历方法:
for(var p in obj){
str = str+obj[p]+’,’;
return str;
}
5.循环遍历json数组并填充表格

<script type="text/jscript">
function each(){
var tableDom = $('table');
var html ="<tr class='title'> <td>序号</td><td>姓名</td><td>密码</td>  </tr>";
var json =[{"name":"张家玮","password":"123456"},{"name":"我推天下","password":"0000量"}];
//下面使用each进行遍历
$.each(json,function(i,item) {
alert(i+' '+item.name+''+item.password);
var trs = "";
trs += "<tr><td>"+(i+1)+"</td><td>" + item.name +"</td><td>" + item.password +"</td></tr>";
html += trs;
});
tableDom.html(html);
}

</script>
<table id="table" width="100%" border="0" cellpadding="0" cellspacing="0"></table>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  ajax js刷新 EL遍历