从jquery的data属性中检索布尔数据
从jquery的data属性中检索布尔数据
提问于 2012-03-29 15:41:48
我试图从html DIV元素中检索Boolean类型的数据属性，但是当字符串被转换为boolean时，它总是返回false。
HTML
<div id='test' data-return="true"></div>JS
isreturn_str = $('#test').data('return');
isreturn = (isreturn_str === 'true');
if (isreturn) {
document.write("It is true");
} else {
document.write("It is false");
}输出
为false
回答 6
Stack Overflow用户
回答已采纳
发布于 2012-03-29 15:48:30
jQuery .data()方法能够智能地识别布尔值和数字值，并将它们转换为本机类型。因此，这将返回布尔值true，而不是"true"
$('#test').data('return');如果您想获取原始数据(不进行自动数据转换)，可以使用.attr()
$('#test').attr("data-return");请参阅此处的工作测试用例：http://jsfiddle.net/jfriend00/6BA8t/
Stack Overflow用户
发布于 2012-03-29 15:45:04
jQuery将字符串"true“识别为与其对应的布尔值(在数据属性上下文中)，因此：
typeof isreturn_str; // boolean但是严格地将其与字符串'true'进行比较会产生false，因为字符串不是布尔值。
Stack Overflow用户
发布于 2018-07-29 20:23:39
在我的例子中，建议的解决方案对我没有帮助，因此我使用jquery创建了自己的布尔转换函数：
/**
* Convert a value into a boolean
* @param {Mixed} value The value to check convert into boolean
* @return {Boolean}
*/
var boolVal=function(value){
var falseValues=['false',0,undefined,'0','no','null',null];
if (typeof value === 'string' || value instanceof String){
value=value.toLowerCase();
}
return $.inArray(value, falseValues) == -1
}因此，我通过attr jquery方法检索值，并像这样传递它，例如：
boolVal($(href).attr('data-sidebar-sm-display'));你也可以在下面的demo中亲眼看到：
var boolVal = function(value) {
var falseValues = ['false', 0, undefined, '0', 'no', 'null', null];
if (typeof value === 'string' || value instanceof String) {
value = value.toLowerCase();
}
return $.inArray(value, falseValues) == -1
}
console.log("#1_true: " + boolVal($("#1_true").attr('data-boolean')))
console.log("#2_true: " + boolVal($("#2_true").attr('data-boolean')))
console.log("#3_true: " + boolVal($("#3_true").attr('data-boolean')))
console.log("#4_true: " + boolVal($("#4_true").attr('data-boolean')))
console.log("#5_true: " + boolVal($("#5_true").attr('data-boolean')))
console.log("#6_true: " + boolVal($("#6_true").attr('data-boolean')))
console.log("#7_true: " + boolVal($("#7_true").attr('data-boolean')))
console.log("#1: " + boolVal($("#1").attr('data-boolean')))
console.log("#2: " + boolVal($("#2").attr('data-boolean')))
console.log("#3: " + boolVal($("#3").attr('data-boolean')))
console.log("#4: " + boolVal($("#4").attr('data-boolean')))
console.log("#4: " + boolVal($("#no_data").attr('data-boolean')))<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="1" data-boolean="false"></div>
<div id="2" data-boolean="0"></div>
<div id="3" data-boolean="null"></div>
<div id="no_data"></div>
<div id="4" data-boolean=false></div>
<div id="1_true" data-boolean=yes></div>
<div id="2_true" data-boolean="yes"></div>
<div id="3_true" data-boolean="true"></div>
<div id="4_true" data-boolean="1"></div>
<div id="5_true" data-boolean=1></div>
<div id="6_true" data-boolean="true"></div>
<div id="7_true" data-boolean="TRUE"></div>
它的基本思想是定义什么数据属性被逻辑认为是“假”，而其他任何数据属性都被设置为真。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9921076
复制相关文章
相似问题