在写正常的jquery的ajax,是想在获得ajax后在回调函数中对dom做些处理,上代码:
//增加新项
$('.btn-add-new-content').click(function () {
$(this).attr('disabled', 'disabled');
var sort_little = $(this).parent().parent().find('.sort').find('.sort_little').html();
var content = $(this).siblings('input').val();
var data = "sort_little=" + sort_little + "&sort_big=" + sort_big + "&content="+ content;
$.post(appPath + '/Service/addNewContent', data, function(data){
if(data.status == 1){
//将新添加的追加到后面
var str = "<div class='unit'><span><input class='question-checkbox' type='checkbox'/></div>";
$(this).before(str);
$(this).siblings('input').html('');
}else{
alert(data.content);
}
$(this).removeAttr('disabled');
});
});
大体的意思是,点击按钮后,想将按钮置换为不可用状态,然后将文本数据发给服务端进行添加,然后在回调函数中在按钮所处div的前面添加更新的字符串str,然后将按钮置换为可用状态。
本以为没问题,测试了好多次,就是不理睬。我还以为是before方法等用错了,后来测试一下才发下,原来这里的$(this)竟然是undefine。回过头来一想,对啊,这里是回调函数,并且匿名的,当程序在本体的时候,this可以理解是本身,但当进入另外一个函数中后,本体this就变成了相对的,除过另外赋值,否者在回调函数中,解释器根本不明白this是个啥玩意。
但传值是不行的,这是个匿名的函数,所以我打算用值域链。改进的代码:
$('.btn-add-new-content').click(function () {
$(this).attr('disabled', 'disabled');
var sort_little = $(this).parent().parent().find('.sort').find('.sort_little').html();
var content = $(this).siblings('input').val();
var data = "sort_little=" + sort_little + "&sort_big=" + sort_big + "&content="+ content;
var $obj = $(this);
$.post(appPath + '/Service/addNewContent', data, function(data){
if(data.status == 1){
//将新添加的追加到后面
var str = "<div class='unit'><span><input class='question-checkbox' type='checkbox'/></div>";
$obj.before(str);
$obj.siblings('input').html('');
}else{
alert(data.content);
}
$obj.removeAttr('disabled');
});
});
nice,问题解决,在回调函数中可以正确的对按钮本身进行操作和索引~