Question

我在data回调中设置后立即阅读特定$.post()属性时遇到问题。一般例子如下。

HTML：

<div id="my-elem" data-id="0"><div>

jQuery的：

var $elem = $('#my-elem');

console.log($elem.data('id')); // Outputs: 0

$.post('/update-stuff', data, function(response) {
    if (response) {
        $elem.data('id', '1'); // Update data value
    }
});

console.log($elem.data('id')); // Still outputs: 0 <= WRONG

如果我在没有Ajax调用的情况下执行相同的操作，并阅读data-id，则会输出1：

var $elem = $('#my-elem');

console.log($elem.data('id')); // Outputs: 0

$elem.data('id', '1'); // Update data value

console.log($elem.data('id')); // Outputs: 1 <= CORRECT

为什么不data设置$.post()回调？

Answer 1

后呼叫是异步的。在下面的代码中，＃3在＃2之前执行，因此即使值已更改，您也没有看到它被更新。

$.post('/update-stuff', data, function(response) {
    if (response) {
        $elem.data('id', '1'); // #2
    }
});

console.log($elem.data('id')); // #3

您必须使用.done()或.success()

$.post('/update-stuff', data, function(response) {
    if (response) {
        $elem.data('id', '1'); // Update data value
    }
}).done(function(){
  console.log($elem.data('id'));
});

在$ .post（）回调中更新后，数据属性值未更改

1 个答案: