jquery의 데이터 속성에서 부울 데이터 검색

jquery의 데이터 속성에서 부울 데이터 검색

---

html DIV 요소에서 부울 유형의 데이터 속성을 검색하려고하지만 클래스가 부울로 변환 될 때 항상 거짓을 반환합니다.

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");
}

많이

거짓입니다

http://jsfiddle.net/neilghosh/494wC/

---

jQuery .data()메서드는 부울 및 숫자 값을 인식하고 기본 유형으로 변환하는 데 현명합니다. 이것은 다음이 따라서 true아닌 부울을 반환합니다 "true".

$('#test').data('return');

원시 데이터를 얻을 수 있습니다 (자동 데이터 변환없이) 다음을 사용할 수 있습니다 .attr().

$('#test').attr("data-return");

여기에서 작동하는 테스트 사례를 참조하십시오 : http://jsfiddle.net/jfriend00/6BA8t/

---

jQuery는 "true"를 부울 대응 (데이터 속성 자동 인식에서)합니다.

typeof isreturn_str; // boolean

그러나 'true'그것은 거짓이 부울이 아니기 때문에 엄격하게 비교하고 있습니다.

---

"true"내부적으로 부울 (시도 alert (typeof(isreturn_str)))로 캐스팅 되므로 ===유형 검사에서 비교가 실패합니다.

전화 할 수 있습니다. .toString()

isreturn_str = $('#test').data('return').toString();

http://jsfiddle.net/494wC/8/

---

제 경우에는 제안 제안 된 솔루션이 도움이되지 않았거나 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
}

그래서 attrjquery 메서드 를 통해 값을 검색하고 예를 들어 다음과 같이 전달합니다.

boolVal($(href).attr('data-sidebar-sm-display'));

또한 다음 견본에서 직접 확인할 수 있습니다.

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>

논리 "거짓"으로 제공되는 데이터 속성을 정의하고 다른 것은 참으로 설정하는 것이 기본 아이디어입니다.

---

jquery 2.1.0을 사용하고 사용하고 eval을 평가합니다.

// $('#test').attr("data-return");" doesn't works
eval($('#test').attr("data-return"));

참고 URL : https://stackoverflow.com/questions/9921076/retrieve-boolean-data-from-data-attribute-in-jquery