如何检查数据属性是否更改

Question

var max = this.collection.max(function(player) {
    return player.get('points');
});

我花了几个小时玩 Backbone .js试图弄清楚如何检查我的最大模型是否发生变化，这几乎是不可能的，所以我决定将模型 cid 设置为数据属性，现在似乎无法检查数据属性是否发生变化？

我这样设置属性，

$(this.$el).attr('data-id', max.cid)

当我的应用重新呈现时，数据属性可能会也可能不会获得新值。我真的不确定如何检查它是否发生变化，我已经看到了很多各种肮脏的黑客和setInterval功能，但没有一个看起来很干净，所以我希望有人知道一个很好的干净方法来做到这一点？

基本上，如果元素从另一个模型渲染新数据（这意味着如果另一个模型取最大值），我只需要控制元素，我需要检查 id 以确认该模型是新版本，并运行动画或渲染它显示它是一个新模型。

Answer 1

首先是 data- 属性 - 虽然您可以使用 .attr 或 .prop 访问数据属性，但数据存储在页面加载时$.cache的对象中，然后进行操作。属性 data-* 永远不会更新。

设置数据

$el.data('id', max.cid);

获取数据

var something = $el.data('id');

不幸的是，如果不使用 setInterval，就无法侦听数据的变化，如之前在这个类似问题中探讨的那样。

也就是说，如果只有您的代码在更新数据，那么合乎逻辑的解决方案是这样的：

设置活动

$el.on('datachange', function(){
    // procedure here
});

然后在更新数据时触发它

$el.data('id', max.cid).trigger('datachange');

或者编写自己的数据函数，使用 .data（） 并触发事件

$.fn.mydata=function(key, variable){
    $(this).data(key, variable).trigger('datachange');
}
$el.mydata('id', max.cid);

---

示例：http://jsfiddle.net/Qn9H6/

$("#test").on('datachange', function(e, key){
    $('#feedback').hide().text('data "' + key + '" was changed to ' + $(this).data(key)).fadeIn(1000);
});
$.fn.mydata=function(key, variable){
    if ($(this).data(key)!=variable){ // check if it's changed
        $(this).data(key, variable).trigger('datachange', key);
    }else{
        console.log('data wasn't changed');
    }
}
$('button').click(function() {
    $("#test").mydata('id', $(this).text());
})
$("#test").mydata('id', 456);