[JQUERY] 속성에 대한 CSS 선택기 대소 문자를 구분하지 않습니다

속성에 대한 CSS 선택기 대소 문자를 구분하지 않습니다

해결법

1. ---

   1.CSS4에는 이제는이 답변을 참조하십시오.

   CSS4에는 이제는이 답변을 참조하십시오.

   그렇지 않으면 jQuery의 경우 사용할 수 있습니다 ...

   $(':input[name]').filter(function() {
      return this.value.toLowerCase() == 'search';
   });
   

   jsfiddle.

   당신은 또한 사용자 정의 선택기를 만들 수 있습니다 ...

   $.expr[':'].valueCaseInsensitive = function(node, stackIndex, properties){
        return node.value.toLowerCase() == properties[3];
   };
   
   var searchInputs = $(':input:valueCaseInsensitive("Search")');
   

   jsfiddle.

   사용자 정의 선택기는 한 번이 작업을 수행하는 경우 약간의 오버 킬입니다.하지만 응용 프로그램에서 여러 번 사용해야하는 경우 좋은 생각 일 수 있습니다.

   물론 다음 예제를 확인하십시오. 그것은 조금 돌파됩니다 (예 : 입력 [값 : value : tolowercase = "검색"] 더 직관적이었을 수 있지만 작동합니다 :)

   $.expr[':'].attrCaseInsensitive = function(node, stackIndex, properties){
       var args = properties[3].split(',').map(function(arg) {
           return arg.replace(/^\s*["']|["']\s*$/g, '');  
       });
       return $(node).attr(args[0]).toLowerCase() == args[1];
   };
   
   var searchInputs = $('input:attrCaseInsensitive(value, "search")');
   

   jsfiddle.

   아마도 eval ()을 사용하여 해당 문자열을 배열로 만들 수는 있지만이 방법을 더 편안하게 찾아냅니다 (그리고 당신은 실수로 당신이 선택자에 어떤 코드를 실행하지 못할 것입니다).

   대신 문자열을 켜고 분리 문자를 분할 한 다음 공백으로 스트리핑하는 것입니다. "각 배열 구성원의 양쪽을 제거하고 있습니다. 인용문 내부는 문자 그대로 치료되지 않습니다. 문자 그대로 필요한 이유는 없으며, 문자 그대로 필요해야합니다. 그러나 당신은 항상이 가능성을 강화할 수 있습니다. 나는 당신에게 그것을 떠날 것입니다 :)

   Map ()은 최상의 브라우저 지원이 있으므로 ARGS 배열을 명시 적으로 반복하거나 배열 개체를 보강 할 수 있습니다.

2. ---

   2.CSS4 (CSS 선택기 레벨 4)는 지원을 추가합니다.

   CSS4 (CSS 선택기 레벨 4)는 지원을 추가합니다.

   input[value='search' i]
   

   그것은 끝 부분에있는 "나는"입니다.

   더 넓은 입양은 2016 년 중반 : 크롬 (V49 이후), Firefox (v47에서 v47?), 오페라 및 다른 사람들이 있습니다. 즉, 깜박임을 사용하지 않기 때문에 가장자리가 아닙니다. "내가 사용할 수 있습니까?"를 참조하십시오 ...

3. ---

   3.

   input[value='Search'] matches
   input[value='search' i] Also matches in latest browsers
   

   지원하다: 버전 : 크롬> = 49.0, Firefox (Gecko)> = 47.0, Safari> = 9

4. ---

   4.셀렉터만으로도 할 수 없으므로 시도해보십시오.

   셀렉터만으로도 할 수 없으므로 시도해보십시오.

   $('input').filter(function() {
       return $(this).attr('value').toLowerCase() == 'search';
   });
   

from https://stackoverflow.com/questions/5671238/css-selector-case-insensitive-for-attributes by cc-by-sa and MIT license