作为题外话,当您可以简单地将函数传递给
首先是小提琴:http://jsfiddle.net/6d82Q/1/
在我的HTML中我有:
<div class="myClass" data-status="true"></div>
<div class="myClass" data-status="false"></div>
我想根据状态为div添加一个CSS-class:
$('.myClass').each(function()
{
// compare status
if($(this).data('status') == 'true')
{
$(this).addClass('myTrueClass');
}
else
{
$(this).addClass('myFalseClass');
}
});
问题是,总是添加myFalseClass
。我的问题是:如何解决这个问题,为什么它会首先发生?
试试,
$('.myClass').each(function()
{
if($(this).data('status'))
{
$(this).addClass('myTrueClass');
}
else
{
$(this).addClass('myFalseClass');
}
});
因为.data(key)
会自动将"true"转换为布尔值。
当然,如果你想获得"true"作为一个字符串,那么只需使用.attr("data-status")
.data()
方法将对[data-*]
属性执行一些自动强制转换,这使得向客户端传递数据非常方便。
当您存储将自动转换为布尔值的内容时,您可以使用:
if ($(this).data('status')) {
...
} else {
...
}
如果你需要确保值是true
,而不仅仅是真值(如1
的值),那么一定要使用引用比较:
if ($(this).data('status') === true) {
...
} else {
...
}
作为题外话,当您可以简单地将函数传递给
.addClass()
时,没有理由调用.each()
:
$('.myClass').addClass(function () {
return $(this).data('status') ? 'myTrueClass' : 'myFalseClass';
});
你必须这样做:
if($(this).data('status') === true)
{
$('#out').append('true <br>');
}
else
{
$('#out').append('false <br>');
}
更新小提琴