通过Jquery中的选择器选择相同的className统一处理表单(可以同时处理多个表单在一个网页中)
2014-02-12 17:16
441 查看
html:
<script type="text/javascript" src="<%=basePath%>js/jquery-1.4.2.min.js"></script>
<div>
//其中 obj为Json中对象名称
<table id='' class='dktable' border='0'>
<tr class='dk_tr'>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.id" class="propvalue"></label></td>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.name" class="propvalue"></label></td>
</tr>
<tr class='dk_tr'>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.sex" class="propvalue"></label></td>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.age" class="propvalue"></label></td>
</tr>
</table>
</div>
Js:
$().ready(function() {
//json格式:{"AAA":{"aa":"111","bb":"222"},"BBB":{"aa":"111","bb":"222"}}
var get_url = "rest/base/transpotCyryHandler/getCyryJsonById";
var param = {'id':cyry_id};
$.ajax({
contentType: "application/x-www-form-urlencoded; charset=utf-8",
dataType:"json",
type: "post",
async:true,
data:param,
url: get_url,
success: function (data){
if(data.hasError){
alert(data.errorMessage);
}else{
var obj = {};
obj = data;
$(".propvalue").each(function(){
var propName = $(this).attr("id"); //propName格式:xx.yy arr = split('.') //$(this).html(obj[xx][yy]);
var propValue = obj;
var propNameArr = propName.split('.');
for(var i=0;i<propNameArr.length;i++){
propValue = propValue[propNameArr[i]];
}
//日期戳转换成日期格式
if(propName =='obj.date'){
if(propValue != '' || propValue != null){
propValue=getFormatDateFromTimes(propValue);//转换函数
}
}
$(this).html(propValue);
});
}
},
complete:function(){
spinner.stop(); //用来停止loading
$(ele).hide();
}
});
});
<script type="text/javascript" src="<%=basePath%>js/jquery-1.4.2.min.js"></script>
<div>
//其中 obj为Json中对象名称
<table id='' class='dktable' border='0'>
<tr class='dk_tr'>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.id" class="propvalue"></label></td>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.name" class="propvalue"></label></td>
</tr>
<tr class='dk_tr'>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.sex" class="propvalue"></label></td>
<td align='right' class="dk_td1">xxx</td>
<td align='left' class="dk_td2"><label id="obj.age" class="propvalue"></label></td>
</tr>
</table>
</div>
Js:
$().ready(function() {
//json格式:{"AAA":{"aa":"111","bb":"222"},"BBB":{"aa":"111","bb":"222"}}
var get_url = "rest/base/transpotCyryHandler/getCyryJsonById";
var param = {'id':cyry_id};
$.ajax({
contentType: "application/x-www-form-urlencoded; charset=utf-8",
dataType:"json",
type: "post",
async:true,
data:param,
url: get_url,
success: function (data){
if(data.hasError){
alert(data.errorMessage);
}else{
var obj = {};
obj = data;
$(".propvalue").each(function(){
var propName = $(this).attr("id"); //propName格式:xx.yy arr = split('.') //$(this).html(obj[xx][yy]);
var propValue = obj;
var propNameArr = propName.split('.');
for(var i=0;i<propNameArr.length;i++){
propValue = propValue[propNameArr[i]];
}
//日期戳转换成日期格式
if(propName =='obj.date'){
if(propValue != '' || propValue != null){
propValue=getFormatDateFromTimes(propValue);//转换函数
}
}
$(this).html(propValue);
});
}
},
complete:function(){
spinner.stop(); //用来停止loading
$(ele).hide();
}
});
});
相关文章推荐
- 同一个表单可以根据用户的选择,提交给不同的后台处理程序
- jQuery 选择器字典 表示可以任意选择一个html 的标签。
- 当一个表单中有多个按钮时,可以通过onclick()事件触发不同的action请求
- 表单流程中一个节点是多人共同执行,每个执行人可以选择下一步要执行人员的实现思路
- 使用jquery选择多个相同class中的一个的方法
- jQuery选择器的过滤器,即对选择的结果再进行一个过滤(如我不想要在<div id="test"></div>这里的input控件)
- 网页中表格还可以这样处理~一个强力的火狐表格插件TableTools2介绍
- Jquery基本选择器 层次选择器 过滤选择器 表单选择器使用示例 带注释
- jquery 通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素(比如由脚本创建的新元素)
- jQuery选择器 基本选择器 层次选择器 表单选择器 过滤选择器 练习 事例
- 如何将一个表单同时提交到两个地方处理
- 发现一个特别小巧的jquery插件可以在选择的时候显示小图
- 话题:jQuery 关于文件上传表单处理的一个非常怪异的问题
- asp.net 读取一个文本文件,并输出到网页显示 通过 一般处理程序实现
- 现在,有两个整数A和B,例如A是345,B是478,现在,需要把B插入到A里, 而A有三位,所以有四个位置选择,所得结果分别是: 478345, 347845, 344785, 345478 我们通过对比可以知道,在这当中最小的一个是344785
- Jquery选择器 选择一个不存在的元素 为什么不会返回 false
- 如何将一个表单同时提交到两个地方处理
- jquery选择器之表单选择\表单对象属性
- jquery/js实现一个网页同时调用多个倒计时(最新的)
- BaseServlet思想(Struts2的思想), BaseServlet,让一个Servlet可以同时处理多个请求