页面部分:
1.加入js:
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
2、对isbn添加<span>
<td><input id="isbn" name="isbn" type="text" /><span id="isbnMsg"></span></td>
添加id属性id="isbn"
3、写script
<script type="text/javascript">
$(document).ready(function(){//监听文档是否加载完毕
$("#isbn").blur(function(){//文档加载完毕后,监听失去焦点事件
//1.获取bookName的值
var tempIsbn = $("#isbn").val();
//2.校验数据后发送ajax请求到服务器,查询书籍是否因录入系统
//使用json发送数据到服务器
$.post("book/search.action",{"isbn":tempIsbn},function(data){
//回调函数:发送异步请求到服务器,服务器处理后会返回相关数据,服务器返回后浏览器会自动调用(回调)该函数
//3.服务器返回查询结果后,提示用户操作
//alert(data);
var d = eval(data);//eval函数把返回的字符串转换成json对象
if (d) {
$("#isbnMsg").text("书籍已经存在");
} else {
$("#isbnMsg").text("书籍不存在");
}
});
});
}
);
</script>
控制类部分:
@RequestMapping("/search")
@ResponseBody//页面内提示
public String search(Book book) {
Book book2 = IBookService.findBookByIsbn(book.getIsbn());
if (book2 != null) {
return "{result:true}";
} else {
return "{result:false}";
}
}
完成了输入信息后提示