今天在寫一個ajax請求的時候出現ajax請求成功後，頁面居然會出現刷新，url有跳轉，找了半天，終於發現了問題所在，原來我在表單裏面有一個 <input type="button" onclick="submit()"/>元素，之前用的是表單提交的方式發送的請求，改成ajax請求後忘記刪除，但是我好奇的是我在js裏面寫的submit()方法已經被刪除了，怎麼還會提交表單呢？
我仔細一看，原來button的onclick事件觸發的submit()方法還是會提交表單，如果將該方法改一下名字，表單就不會提交了！。
下面是我的jsp頁面：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/jsp/meta.jsp" %>
<title>登錄頁面</title>
</head>
<body>
<form action="login/userLogin" method="post">
用戶名： <input type="text" name="userName" id="userName" /><span id="user_message"></span> <br/>
密碼：<input type="password" id="pwd" name="pwd"/><span id="pwd_message"></span> <br/>
<span><button id="btn" onclick="submit()">登錄</button></span>
</form>
</body>
</html>
<script type="text/javascript">
$(function(){
var oBtn =document.getElementById('btn');
//ajax請求獲取用戶登錄信息
$(oBtn).click(function()
{
var login_message ={'userName':$("#userName").val(),'pwd':$("#pwd").val()};
$.ajax({
url:'<%=ctx%>/login/userLogin',
type:'post',
data:login_message,
//contentType: "application/json; charset=utf-8",
dataType:'json',
success:function(data){
console.log(JSON.stringify(data));
console.log(eval('('+data+')'));
var result= eval('('+data+')');
},
error:function(data){
console.log(JSON.stringify(data));
}
});
//oForm.submit=true;
});
});
</script>