情景一：不存在Ajax异步操作
1 使用背景：会议室预定管理系统中，当表单提交的时候需要验证预约的时间是否符合预定规则（不需要通过访问服务器），否则提示错误信息，阻止表单提交。
2 相关技术点：
form的两个事件
- submit，提交表单，如果直接调用该函数，则直接提交表单
- onSubmit，提交按钮点击时先触发，然后触发submit事件。如果不加控制的话，默认返回true，因此表单总能提交。
3 Demo
页面代码：
1 @using (Html.BeginForm(null, null, null, FormMethod.Post, new { onSubmit = "returncheck();" })) // 注意：此处事件的写法：onsubmit = "return + 事件名（）"
{
<input type="text" name="name">
<input type="submit" value="提交">
4 }
JS代码：
function check(){
if (document.testform.name.value=="admin") {
alert("姓名不正确");
return false;
}
else{
return true;
}
}
情景二：需要Ajax异步操作
1 使用背景：会议室预定管理系统中，当表单提交的时候需要验证预约的时间是否符合预定规则（需要通过访问服务器数据判断），否则提示错误信息，阻止表单提交。
2 相关技术点：
在下面的例子中，通过onsubmit() 方法阻止提交无效的，因为， JS 中 Ajax 部分与 其他部分是异步进行的，或者说同时进行，代码执行（过程A）1/5行后直接执行23行，与此同时（过程B）6/22行也在进行，显然过程B的执行进度会慢，所以还没有等到判断返回值，A就已经执行完毕，默认Str是true，所以ajax中的判断是无效的。
示例： Javascript代码：
$("#save").click(function mysubmit() {
var str;
var startime = $("#datetime1").val();
var endtime = $("#datetime2").val();
var num = $("#mark").val();
$.ajax({
type: "POST",
url: "/MeettingRoom/meetting",
data: { strattime: startime, endtime: endtime, num: num },
success: function (sesponseTest) {
if (sesponseTest == "1") {
str = false;
document.getElementById("metend").style.display = "block";
}
else {
str = true;
document.getElementById("metend").style.display = "none";
}
}
});
return str;
}); //
<form onsubmit = "return check()"></form>
3 化解方法Demo：
Javascript代码：
<script>
$("#save").click(function mysubmit() {
var str;
var startime = $("#datetime1").val();
var endtime = $("#datetime2").val();
var num = $("#mark").val();
$.ajax({
type: "POST",
url: "/MeettingRoom/meetting",
data: { strattime: startime, endtime: endtime, num: num },
success: function (sesponseTest) {
if (sesponseTest == "1") {
str = false;
document.getElementById("metend").style.display = "block";
}
else {
str = true;
document.getElementById("metend").style.display = "none";
$("#form").submit(); // 将提交的进程放在判断过程中，*提交操作等待后台访问完毕后执行
}
} }); });
</script>
<button class="btn blue" type="button" id ="save" ><i class="icon-ok"></i>保存</button>
2016/04/12 ------神奇的Javascript。