2013-11-22 79 views
3

我正在創建一個設置2個屬性的頁面,然後我試圖在頁面加載後引用這些屬性。jQuery設置屬性,然後獲取屬性

我已經能夠設置沒有問題的屬性,如果我將它們硬編碼到信用卡和借記卡屬性中,我也能夠引用這些屬性。

但試圖動態調用它們不起作用。接受建議。

<div class="net" credit="" debit=""></div> 


$(document).ready(function() { 
    ... some fancy code involving arrays and junk ... 
    if(TYPE == 'credit') { 
     $(".net").attr('credit',data.response.stats.total); 
    } else if (TYPE = 'debit') { 
     $(".net").attr('debit',data.response.stats.total); 
    } 
}); 

$(window).bind("load", function() { 
    afterPageLoad(); 
}); 

function afterPageLoad(){ 
    total_credit = $(".net").attr('credit'); 
    total_debit = $(".net").attr('debit'); 
    total = (total_credit - total_debit); 
    $(".net").html("$"+total); 
} 
+0

看起來好像沒什麼問題http://jsfiddle.net/arunpjohny/8m3Gh/1/雖然我會建議使用'。數據()' –

+0

在您的瀏覽器控制檯 –

+0

任何錯誤你應該使用'parseFloat();'當獲取信用和借記的屬性 –

回答

3

建議使用可通過jQuery.data()讀取data-屬性

<div id="test" data-foo="bar"></div> 

GET

alert($('#test').data('foo')) 

SET

$('#test').data('foo','new value, or object or array')) 

的屬性不必存在用這個。您可以隨時在元素上存儲任何內容,也可以在標記中讀取數據。

jQuery.data() API Docs

0

要閱讀動態屬性值,你需要使用prop()而不是attr()

理想的情況下,但你應該自定義存儲在data-屬性值(即0​​),然後使用jQuery的data()方法獲取/設置的值。

+0

不是真的關於attr vs道具http://jsfiddle.net/xP5v6/ – charlietfl

1

的問題是「......涉及陣列和垃圾一些奇特的代碼......」

data.response建議你調用Ajax是異步的,你想在設置之前閱讀屬性。

將邏輯放入Ajax調用的回調中,不要在onload部分調用。

+0

這也有幫助,謝謝你。這確實意味着我多次調用afterPageLoad(),但我認爲文檔準備好和文檔加載實際上意味着它們會在加載頁面之前和之後發生! – Ben

+0

是的,但這並不意味着它會等待加載的Ajax請求,它只是文檔。 – epascarello

+0

再次,謝謝。你是我曾經說過的最好的維京人。 – Ben

0

當斂屬性爲total_credittotal_debit你應該使用parseFloat();

例如:parseFloat($(".net").attr('credit'));

你也應該設定在屬性未設置的情況下的備用。

例如:total_credit = parseFloat($(".net").attr('credit')) || 0;

$(document).ready(function() { 
    var TYPE = 'credit'; 
    if(TYPE == 'credit') { 
     $(".net").attr('credit', 123); 
    } else if (TYPE = 'debit') { 
     $(".net").attr('debit', 53); 
    } 
}); 

$(window).bind("load", function() { 
    afterPageLoad(); 
}); 

function afterPageLoad(){ 
    total_credit = parseFloat($(".net").attr('credit'))||0; 
    total_debit = parseFloat($(".net").attr('debit'))||0; 
    total = (total_credit - total_debit); 
    $(".net").html("$"+total); 
}