web-dev-qa-db-ja.com

データ属性が変更されたかどうかを確認するにはどうすればよいですか?

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

私はbackbone.jsで数時間遊んで、最大モデルが変更されたかどうかを確認する方法を見つけようとしましたが、ほとんど不可能だったので、モデルcidをデータ属性として設定することにしました。データが変更されたかどうかを確認できないようです。 -属性の変更?

このように属性を設定し、

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

アプリがデータを再レンダリングすると、属性は新しい値を取得する場合と取得しない場合があります。変更されているかどうかを確認する方法が本当にわかりません。さまざまなダーティハックやsetInterval機能をたくさん見ましたが、何もきれいに見えなかったので、誰かがこれを行うための素敵なクリーンな方法を知っていることを願っていますか?

基本的に、別のモデルから新しいデータをレンダリングする場合(つまり、別のモデルが最大値を取るかどうか)、要素を制御したいだけです。IDをチェックしてモデルが新しいバージョンであることを確認し、アニメーションを実行するか、レンダリングする必要があります。それが新しいモデルであることを示しています。

18

まず、data-attribute-.attrまたは.propを使用してdata属性にアクセスできますが、データはページの読み込み時にオブジェクト$.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);
20
Popnoodles