javascript之类型陷阱
2016-01-09 20:54
627 查看
今天分享一个我前几天写代码遇到的经典错误,大家也一起来找找,看你们能发现吗?
项目就是一个简单的ajax用户名验证,下面用代码开始讲解:
前端页面:
<script type='text/javascript' src='jquery.js'></script>
<form action="" method='post'>
用户名:<input type='text' name='uname'><span></span><br/>
</form>
JS验证代码:
<script type='text/javascript' >
$('input[name=uname]').blur = function(){
// jquery的强大选择器和blur方法
var obj = $(this);
// 当前表单对象
var send_data = {'uname':obj.val()};
$.post('check.php',send_data,function(data){ // jquery的post请求Ajax验证
if(data){
// jquery的连缀,next()指代的是span标签,而html是span标签的方法
obj.next().html("<font style='color:red'>用户名已经存在</font>");
}else{
obj.next().html("<font style='color:green'>用户名可以使用</font>");
}
})
}
</script>
PHP后端代码:
$arr = array('Klose','Kobe','Bayern');
if(in_array($_POST['uname'],$arr)){
echo 1;
}else{
echo 0;
}
好了,代码写完了,但是这个时候你运行程序,无论你在表单填写的是任何名字,得到的结果都是:“用户名已经
存在”!!!为什么会这样呢?我其实也困扰了很久,程序逻辑处理看似没有问题,但是却忽略了一个知识点,那就是
javascript其实也是有类型的,我们从PHP页面返回的值,在js页面用typeof打出来,结果发现:是string字符类型,
也就是从表面上看是数字0或者1,结果是字符0或者1,因此if(data)会永远是真!
解决办法有两个:1. js判断加上一句:if(data == 1),这样虽然字符1和数字1的类型不同,但是==只判断数值,因
此这种方法是可行的(不推荐); 2. 改写PHP页面的代码,直接返回true和false,这样避免了类型问题(推荐)
大家可以关注我的微信公众号:iwork,我会每天推送一篇原创文章,让大家都能有所收获!
项目就是一个简单的ajax用户名验证,下面用代码开始讲解:
前端页面:
<script type='text/javascript' src='jquery.js'></script>
<form action="" method='post'>
用户名:<input type='text' name='uname'><span></span><br/>
</form>
JS验证代码:
<script type='text/javascript' >
$('input[name=uname]').blur = function(){
// jquery的强大选择器和blur方法
var obj = $(this);
// 当前表单对象
var send_data = {'uname':obj.val()};
$.post('check.php',send_data,function(data){ // jquery的post请求Ajax验证
if(data){
// jquery的连缀,next()指代的是span标签,而html是span标签的方法
obj.next().html("<font style='color:red'>用户名已经存在</font>");
}else{
obj.next().html("<font style='color:green'>用户名可以使用</font>");
}
})
}
</script>
PHP后端代码:
$arr = array('Klose','Kobe','Bayern');
if(in_array($_POST['uname'],$arr)){
echo 1;
}else{
echo 0;
}
好了,代码写完了,但是这个时候你运行程序,无论你在表单填写的是任何名字,得到的结果都是:“用户名已经
存在”!!!为什么会这样呢?我其实也困扰了很久,程序逻辑处理看似没有问题,但是却忽略了一个知识点,那就是
javascript其实也是有类型的,我们从PHP页面返回的值,在js页面用typeof打出来,结果发现:是string字符类型,
也就是从表面上看是数字0或者1,结果是字符0或者1,因此if(data)会永远是真!
解决办法有两个:1. js判断加上一句:if(data == 1),这样虽然字符1和数字1的类型不同,但是==只判断数值,因
此这种方法是可行的(不推荐); 2. 改写PHP页面的代码,直接返回true和false,这样避免了类型问题(推荐)
大家可以关注我的微信公众号:iwork,我会每天推送一篇原创文章,让大家都能有所收获!
相关文章推荐
- 一个关于if else容易迷惑的问题
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- PHP5.2.*防止Hash冲突拒绝服务攻击的Patch
- 深入理解PHP之匿名函数
- JavaScript演示排序算法
- 2015-2016网页设计趋势分析 Web Design of Trends
- JSP/PHP基于Ajax的分页功能实现
- javascript实现10进制转为N进制数
- 关于PHP通过PDO用中文条件查询MySQL的问题。
- jQuery Ajax 跨域调用
- 什么是设计模式
- 移动端的长按事件
- jquery教程靠边站,一分钱不花让你免费学会jquery
- JQuery+Strusts1.x无刷新登录
- PHP数据库长连接mysql_pconnect的细节