网络选图
数据提交
同步提交
方式一：
<body>
<form action="form_action.asp" method="get">
<p>
用户名: <input type="text" name="fname" />
</p>
<p>
密码: <input type="text" name="lname" />
</p>
<input type="submit" value="Submit" />
</form>
</body>
方式二：
<body>
<form action="login" method="get" id="myForm">
<p>
用户名: <input type="text" name="fname" />
</p>
<p>
密码: <input type="text" name="lname" />
</p>
<input type="button" value="Submit Form" />
</form>
</body>
<script type="text/javascript">
$(document).ready(function() {
$('input:button').click(function() {
$('#myForm').submit();
});
});
</script>
方式三：
<div>
<a href="javascript:doSubmit();">提交方式四</a>
</div>
function doDetails(index) {
var orderListData = $ {
orderInfo
};
var thisRow = JSON.stringify(orderListData[index]);
var form = $("<form method='post'></form>");
form.attr({
"action": "${base}/member/order/orderDetails.jhtml"
});
// 代码规范：单引号和双引号的使用
var input1 = $('<input />').attr('type', 'hidden').attr('name', 'orderI').val(thisRow);
var input2 = $('<input />').attr('type', 'hidden').attr('name', 'token').val(getCookie("token"));
form.append(input1);
form.append(input2);
$(document.body).append(form);
form.submit();
}
方式四：
<body>
<form action="login" method="get" id="myForm">
<p>
用户名: <input type="text" name="fname" />
</p>
<p>
密码: <input type="text" name="lname" />
</p>
<input id="sub" type="button" value="提交" />
</form>
</body>
<script type="text/javascript">
$("#sub").click(function() {
var form = new FormData(document.getElementById("myForm"));
alert(form);
$.ajax({
url: "login",
type: "POST",
processData: false,
contentType: false,
data: form,
dataType: "JSON",
success: function(result) {
alert(result.user);
}
});
});
</script>
异步提交
方式一：
$('#sub').click(function() {
$.ajax({
url: "#",
type: "POST",
data: {},
dataType: "JSON",
success: function(result) {
alert(result.user);
}
});
});
方式二：
$('#sub').click(function() {
$.post('/addUsers', $('#hello').serialize(),
function(data) {
console.info(data);
},'json');
});
异步和&同步比较
- form是同步提交，而ajax是异步提交。
- ajax只是会请求到数据不会进行页面的跳转，而form会页面的跳转。
数据请求
JSON的字符串解析成JSON数据
// 定义一个一个对象
var data={name:'goatling'}
// 解析成JSON字符串
JSON.stringify(data)
数据回显
// 定义一个字符串
var data='{"name":"goatling"}'
// 解析对象
JSON.parse(data)
结果是：
name:"goatling"
特别提醒：数据的转换需要根据请求的接口转换，如果请求的接口中带@RequestBody注解，需要传输的是JSON字符串，此时需要使用JSON.stringify(data)；进行数据的转换，如果请求的接口中不带@RequestBody注解，此时可以直接传输数据的对象。
JavaScript解析时间日期回显问题
时间格式处理方式一
function func(fmt) {
var year = 1900 + fmt.year;
var month = (fmt.month + 1) < 10 == 1 ? "0" + (fmt.month + 1) : (fmt.month + 1);
var day = fmt.date < 10 ? "0" + fmt.date : fmt.date;
var hours = fmt.hours < 10 ? "0" + fmt.hours : fmt.hours;
var minutes = fmt.minutes < 10 ? "0" + fmt.minutes : fmt.minutes;
var seconds = fmt.seconds < 10 ? "0" + fmt.seconds : fmt.seconds;
return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
}
var aa =
eval("("+ "{\"date\":18,\"hours\":14,\"seconds\":9,\"month\":9,\"nanos\":0,\"timezoneOffset\":-480,\"year\":117,\"minutes\":50,\"time\":1508309409000,\"day\":3}" + ")");
alert(func(aa));
</script>
时间格式处理方式二
var d = new Date('Thu May 12 2016 08:00:00 GMT+0800 (中国标准时间)');
youWant=d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate() + ' ' + d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds();
//yyyy-MM-dd hh:mm:ss
