我正在创建一个设置2个属性的页面,然后在页面加载后尝试引用这些属性。
我已经能够毫无问题地设置属性,如果我将这些属性硬编码到贷方和借方属性中,我也能够引用这些属性。
但是尝试动态地调用它们是行不通的。对建议持开放态度。
<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 );
}
建议使用jQuery.data()可以读取的data-
属性
<div id="test" data-foo="bar"></div>
获取
alert( $('#test').data('foo'))
设置
$('#test').data('foo','new value, or object or array'))
属性不必存在就可以使用它。您可以随时在元素上存储任何内容,也可以读取标记中的数据。
jQuery.data()API文档
问题是"…一些涉及数组和垃圾的花哨代码…"
data.response
建议您进行异步Ajax调用,并尝试在设置属性之前读取这些属性。
将逻辑放在Ajax调用的回调中,不要在onload部分调用。
要读取动态属性值,需要使用prop()
而不是attr()
。
然而,理想情况下,您应该将自定义值存储在data-
属性(即data-credit
)中,然后使用jQuery的data()
方法来获取/设置该值。
获取total_credit
和total_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 );
}