函数中的 this 指的是函数作为哪个对象的方法被调用,this 就是那个对象。当函数作为构造函数通过 new 来使用时,this 指当下新建的对象。通过 addEventListener 注册的事件回调函数中的 this 指的是事件所注册的对象。
比如说我有一段js
var modifyCartProductNum = function (operate, that) {
var thisDom= that;
var cartIdDom = $(thisDom).parent().siblings().filter('.cartId');
var cartNumDom = $(thisDom).siblings().filter('.num');
var cartId = parseInt($(cartIdDom).text());
var cartNum = parseInt($(cartNumDom).val());
if (isNaN(cartId) || isNaN(cartNum)) {
alert("出现错误");
return;
}
if (operate == '+') {
cartNum += 1;
} else if (operate == '-') {
if (cartNum == 1) {
return;
} else {
cartNum -= 1;
}
}
console.log('cartId=' + cartId + ';cartNum=' + cartNum);
//TODO 这里对应 购物车修改产品数量API 要修改API 为购物车的id;同时通过util.js获取userId
//TODO 这里与服务器交换 返回成功后 修改页面中的num
var cartData = {
cartId: cartId,
userId: 3,
cartNum: cartNum
};
$.ajax({
url: '/aijialeFront/api/user/cart/modifyProductNum.json',
type: 'POST',
data: cartData,
dataType: 'json',
success: function (data) {
console.log(data);
if (data.code == 200) {
$(cartNumDom).val(cartNum);
} else {
alert(data.error);
}
},
error: function () {
alert('服务器内部故障');
}
});
};
//TODO 这里要写blog 直接调用modifyCartProductNum(会执行一遍) 与在function中调用的区别
$('#content span.add').click(function () {
modifyCartProductNum('+',this)
});
$('#content span.sub').click(function () {
modifyCartProductNum('-',this)
});
如果modifyCartProductNum中 var thisDom=this;下面通过jquery通过dom关系就得不到相应的dom对象了,因为你调用了modifyCartProductNum函数此时是个变量,即通过modifyCartProductNum作为构造函数的一个对象,此时modifyCartProductNum函数中的this是指这个函数类型的对象。而这里
$('#content span.add').click(function () {
modifyCartProductNum('+',this)
});
中的this是指$('#content span.add')的dom对象本身,因为你click函数调用了里面的函数里面的this就是dom对象