话说：
各位读者盆友，中午好！这个Bug之所以专门用一篇博客来讲解，表明这个Bug是费了俺老孙一点时间的，而且之前从来没有遇到过，而且这个bug还是蛮特别的。
目录：
1.Bug内容
2.总结
1.Bug内容
Uncaught RangeError: Maximum call stack size exceeded
网上答案说：递归调用，导致内存溢出，前端导致内存溢出，还是有点意思的呢！
毫无疑问，是Ajax代码中递归调用了，但是究竟是哪里递归调用了呢？根本看不出来啊。Ajax代码如下：
//用户名blur()验证
$("#userName").blur(function() {
var userNameInfo = $("#userNameInfo");
if($(this).val().trim() == "") {
userNameInfo.html("请输入用户名");
}else{
userNameInfo.html("");
//Ajax验证
$.ajax({
url:"checkLoginByUserName",type:"get",dataType:"json",async:true,data:{"userName":userName},success:function(data) {
alert("请求后台成功！"+data);
},error:function() {
alert("遗憾，请求后台失败");
}
});
}
});
问题在这里：userName和data传过去的userName一样。
问题在于：data传过去的userName和blur()事件的userName是同一个userName,都是全局变量。这样意味着：只要userName有内容，一旦发生blur()就去调用Servlet,然后又把自己作为值传进去，然后就发生了递归！一定要注意你这个data:{“”,userName}中传过去的名字和blur()事件的名字要不一致，或者说一个是全局，一个是局部，颜色会有微妙变化。
注意颜色区别：
最终这么写，妥妥的
//一进来 userName就应该聚焦
$(function() {
// $("#userName").focus();
//用户名blur()验证
$("#userName").blur(function() {
var userName2 = $(this).val().trim();
var userNameInfo = $("#userNameInfo");
if($(this).val().trim() == "") {
userNameInfo.html("请输入用户名");
}else{
userNameInfo.html("");
//Ajax验证
$.ajax({
url:"checkMemberName",data:{"userName":userName2},//一定要注意这个userName2不要和$("#userName").blur()冲突，否则递归调用！！还不以发现
success:function(data) {
//alert("请求后台成功！"+data);
if(data != "") {
$("#userNameInfo").html("√");
$("#userNameInfo").css({"font-size":"25px","color":"green","font-weight":"bolder"});
}else{
$("#userNameInfo").html("×");
$("#userNameInfo").css({"font-size":"30px","color":"red","font-weight":"bolder"});
}
},error:function() {
alert("遗憾，请求后台失败");
}
});
}
});
2.总结
遇到Bug的时候，不要一开始就排除一些原因，也许最开始排除的就是最可能的，另外要大胆尝试，综合网上各种资料，虽然有的回答不敢恭维，但是多少能给我们提供点灵感。
另外，记住，千万不要因为小小Bug影响了心情，要有百折不挠的精神哈。
“我一定会回来的”！
哈哈，再会！