当点击submit提交form表单的时候, 他会刷新一次
前端页面:
<form class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control" placeholder="姓名" id="input_empName">
<input type="text" class="form-control" placeholder="邮箱" id="input_empEmail">
</div>
<button type="submit" class="btn btn-default" id="search">Submit</button>
</form>
js代码:
//模糊搜索
$("#search").click(function () {
//获取姓名框内容
empName=$("#input_empName").val();
//获取邮箱框内容
empEmail=$("#input_empEmail").val();
//alert(empName);
//给emps添加参数 共用一个接口实现查询
$.ajax({
url: "${pageContext.request.contextPath}/emps?empName="+ empName +"&empEmail="+empEmail,
type: "GET",
success:function (result) {
//解析员工的信息展示,抽取个方法 表格
parseEmpsInfo(result);
//解析分页数据,抽取个方法 总页数,总条数
parseLimitInfo(result);
//解析分页条的信息
parseLimitBarInfo(result);
}
})
})
解决办法:
法一:在Ajax请求中加return false
//模糊搜索
$("#search").click(function () {
//获取姓名框内容
empName=$("#input_empName").val();
//获取邮箱框内容
empEmail=$("#input_empEmail").val();
//alert(empName);
//给emps添加参数 共用一个接口实现查询
$.ajax({
url: "${pageContext.request.contextPath}/emps?empName="+ empName +"&empEmail="+empEmail,
type: "GET",
success:function (result) {
//解析员工的信息展示,抽取个方法 表格
parseEmpsInfo(result);
//解析分页数据,抽取个方法 总页数,总条数
parseLimitInfo(result);
//解析分页条的信息
parseLimitBarInfo(result);
}
})
return false;
})
法二:利用iframe
<form action="" method="post" target="the_iframe">
<input; type="text" id="id_input_text" name="the_input_text" />
<input type="submit" id="id_submit" name="the_submit" value="提交" />
</form>
<iframe id="is_iframe" name="the_iframe" style="display:none;"></iframe>