从 jquery 中的数据属性中检索布尔数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9921076/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Retrieve boolean data from data attribute in jquery
提问by Neil
I am trying to retrieve a data attribute of type Boolean from an html DIV element , however it is always returning false when the string is converted to boolean .
我试图从 html DIV 元素中检索 Boolean 类型的数据属性，但是当字符串转换为 boolean 时它总是返回 false。
HTML
HTML
<div id='test' data-return="true"></div>
JS
JS
isreturn_str = $('#test').data('return');
isreturn = (isreturn_str === 'true');
if (isreturn) {
document.write("It is true");
} else {
document.write("It is false");
}
output
输出
It is false
这是假的
回答by jfriend00
The jQuery .data()method is smart about recognizing boolean and numeric values and converts them into their native type. So this returns the boolean true, not "true":
jQuery.data()方法很聪明地识别布尔值和数字值并将它们转换为它们的本机类型。所以这将返回 boolean true，而不是"true"：
$('#test').data('return');
If you want to get the raw data (without the automatic data conversion), you can use .attr():
如果你想获得原始数据（没有自动数据转换），你可以使用.attr()：
$('#test').attr("data-return");
See the working test case here: http://jsfiddle.net/jfriend00/6BA8t/
在此处查看工作测试用例：http: //jsfiddle.net/jfriend00/6BA8t/
回答by Yoshi
jQuery recognizes the string "true" as it's boolean counterpart (in the context of data attributes) and thus:
jQuery 将字符串“true”识别为它的布尔对应物（在数据属性的上下文中），因此：
typeof isreturn_str; // boolean
but you're strictly comparing to the string 'true'which yields false as a string is not a boolean.
但是您严格地与'true'产生 false的字符串进行比较，因为字符串不是布尔值。
回答by Andreas Wong
"true"is internally casted to boolean (try alert (typeof(isreturn_str))), hence your ===comparison fails on type check.
"true"在内部转换为 boolean (try alert (typeof(isreturn_str)))，因此您的===比较在类型检查时失败。
You could call .toString()
你可以打电话 .toString()
isreturn_str = $('#test').data('return').toString();
回答by Dimitrios Desyllas
In my case the proposed solutions did not helped me therefore I created my own boolean conversion function using jquery:
就我而言，建议的解决方案对我没有帮助，因此我使用 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
}
So I retrieve the value via attrjquery method and I pass it like that for example:
因此，我通过attrjquery 方法检索该值，然后像这样传递它，例如：
boolVal($(href).attr('data-sidebar-sm-display'));
Also you can see it for youself in the following 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>The basic idea it to define what data-attribute is considered by logic "false" and anything else is set as true.
基本思想是定义什么数据属性被逻辑“假”考虑，其他任何东西都被设置为真。
回答by Javier Gutierrez
I'm using jquery 2.1.0 and I have to use eval
我正在使用 jquery 2.1.0，我必须使用 eval
// $('#test').attr("data-return");" doesn't works
eval($('#test').attr("data-return"));
