Jquery 선택기 입력 [type = text] ')

98

기본적으로 input type=text다음과 같은 모든 요소를 선택하는 코드를 작성했습니다 .

$('.sys input[type=text]').each(function () {}

input[type=text]또는 선택하려면 어떻게 변경 select합니까?

javascript jquery

— 잭
소스

177

일반적인 CSS 선택기 사용 :

$('.sys input[type=text], .sys select').each(function() {...})

반복이 마음에 들지 않으면 :

$('.sys').find('input[type=text],select').each(function() {...})

또는 더 간결하게 context인수를 전달하십시오.

$('input[type=text],select', '.sys').each(function() {...})

참고 : 내부적으로 jQuery위의 내용을 find()동등한 것으로 변환합니다.

http://api.jquery.com/jQuery/

내부적으로 선택자 컨텍스트는 .find () 메서드로 구현되므로 $ ( 'span', this)는 $ (this) .find ( 'span')와 동일합니다.

개인적으로 가장 읽기 쉬운 첫 번째 대안을 찾습니다. :)

— 안드레아스 웡
소스

1

(가) 이후 context form를 사용하고 find form상기가 find form댄 더 효율적이다 context form(한 통화 기능 회피). 이것은 사용되는 거의 모든 선택기에 유효합니다. 그리고,이 IMO는 find form댄 더 효율적 normal CSS selector셀렉터의 두 부분은 상기 루트 노드에 상대적이기 때문에 find form, 단지 .sys부분이 상대적이며 그리고, input[type=text],select더 빨리 할 수 있으므로 소자의 더 작은 세트 실행될 (그러나 테스트를 통해 확인해야 함)

— pomeh

1

@pomeh 어디에서 왔는지 알 수 있지만 $호출 성능이 앱에 그렇게 중요 하다면 jQuery를 아예 사용하지 마십시오 :). 이 답변은 OP의 질문에 대답하려고 시도했습니다. 성능 문제 였다면이 답변은 처음에는 여기에 없을 것입니다. 어쨌든 댓글 주셔서 감사합니다 :), 감사합니다

— Andreas Wong

1

내 의견은 한 번의 $통화 성능에 대한 것이 아니라 하나의 응용 프로그램에있는 모든 $통화 에 대한 것이 었습니다 . IMO, 같은 일을 다른 방법으로 할 때 나는 항상 더 나은 BC를 수행하는 것을 선택하려고 노력합니다. slow performance=== unhappy users. 또한, 우리는 할 수 있습니다 모두 (내가 코멘트에서처럼) 영업의 여러 답변 질문 (당신처럼) 및 제공 장점 / 그들 각각의 불편에 응답합니다. IMO는 동일한 결과를 제공하면서 모든 답변이 다른 이유를 알아 차리는 것이 중요합니다. 또한 느리게 수행되는 바닐라 JavaScript 코드를 작성할 수 있습니다. JavaScript! ==performance

— pomeh

1

@pomeh 성능에 대한 내 요점은 성능에 대해 정말로 관심이 있다면 jQuery를 사용하지 말고 $div를 구체적으로 분류하고 선택기의 많은 검사 / 문자열 구문 분석을 수행하는 document.getElemenById/ElementsByClassName것보다 $jQuery가 유명하지 않다는 것입니다. 성능 라이브러리를 위해. 그리고 솔직히 전화로 인해 앱 속도가 느려지는 것을 보지 못했습니다.$ 너무 많은 그 문제가있는 웹 사이트가 있다면 저에게 보여주세요. 저는 매우 관심이 있습니다. :)

— Andreas Wong

2

@pomeh 네, JS! = Performance :)에 대한 당신의 요점에 전심으로 동의합니다. 짧은 토론에 감사드립니다. 좋은 하루 되세요 :)

— Andreas Wong

7

$('.sys').children('input[type=text], select').each(function () { ... });

편집 : 실제로 위의 코드 .sys > input[type=text]는 하위 선택 ( .sys input[type=text])을 원하는 경우 @NiftyDude에서 제공하는 옵션을 사용해야하는 경우 하위 선택기와 동일합니다 .

추가 정보:

— Wouter J
소스

당신은 입력 chilren대신children

— pomeh

5

반복해야하는 양식이나 테이블의 텍스트로 여러 입력이있는 경우 다음을 수행했습니다.

var $list = $("#tableOrForm :input[type='text']");

$list.each(function(){
    // Go on with your code.
});

내가 한 것은 유형이 "텍스트"로 설정되어 있는지 확인하기 위해 각 입력을 확인한 다음 해당 요소를 가져와 jQuery 목록에 저장하는 것입니다. 그런 다음 해당 목록을 반복합니다. 다음과 같이 현재 반복에 대한 임시 변수를 설정할 수 있습니다.

var $currentItem = $(this);

이것은 현재 항목을 각 루프의 현재 반복으로 설정합니다. 그런 다음 temp 변수로 원하는 것을 할 수 있습니다.

이것이 누구에게나 도움이되기를 바랍니다!

— 제이슨 시드 라스
소스

3

$('input[type=text],select', '.sys');

루핑 :

$('input[type=text],select', '.sys').each(function() {
   // code
});

— thecode 역설
소스