jQuery의 다중 선택기 체인?
일반적으로 클래스를 선택기로 사용할 때 "id"선택기를 사용하여 전체 페이지를 검색하지 않고 클래스가있는 영역 만 검색합니다.
그러나 코드가 포함 된 부분보기가 있습니다. 이 부분보기 (공통 코드)는 양식 태그를 둘러 쌉니다.
나는 가지고있다:
<form id="Create">
// load common code in from partial view
</form>
<form id="Edit">
// load common code in from partial view
</form>
이제이 공통 코드에서 플러그인을 여러 필드에 연결해야하므로
$('#Create .myClass').plugin({ options here});
$('#Edit .myClass').plugin({options here});
따라서 거의 동일한 코드입니다. 이드 중 하나를 찾는 방법이 있는지 궁금합니다.
편집하다
선택자에 대한 변수가있을 때 문제가 있습니다.
my.selectors =
{
A: '#Create',
B: '#Edit',
Plugin: ' .Plugin'
};
$(selector.A+ selectors.Plugin, selector.B+ selectors.Plugin)
실행되지 않는 것 같습니다.
여러 선택기를 쉼표로 결합 할 수 있습니다.
$('#Create .myClass,#Edit .myClass').plugin({options here});
또는 여러 가지를 포함 할 경우 모든 양식 요소에 클래스를 추가 한 다음 해당 클래스 내에서 검색 할 수 있습니다. 이것은 검색을 제한함으로써 예상되는 속도 절감 효과를 얻지 못하지만 솔직히 내가 당신이라면 그것에 대해 너무 걱정하지 않을 것입니다. 브라우저는 일반적인 작업을 최적화하기 위해 많은 멋진 작업을 수행합니다. 간단한 클래스 선택기가 더 빠를 수 있습니다.
$("#Create").find(".myClass").add("#Edit .myClass").plugin({});
$.fn.add
두 세트를 연결하는 데 사용 합니다.
다음을 사용할 수 있어야합니다.
$('#Edit.myClass, #Create.myClass').plugin({options here});
이 방법으로 수행하면 약간 더 나은 성능을 볼 수 있다고 생각합니다.
$("#Create, #Edit").find(".myClass").plugin(){
// Options
});
처럼:
$('#Create .myClass, #Edit .myClass').plugin({
options: here
});
여러 선택기를 지정하여 단일 결과로 결합 할 수 있습니다. 이 다중 표현식 결합기는 서로 다른 요소를 선택하는 효율적인 방법입니다. 반환 된 jQuery 객체의 DOM 요소 순서는 문서 순서이므로 동일하지 않을 수 있습니다. 이 결합 자의 대안은 .add () 메서드입니다.
여기에는 이미 매우 좋은 답변이 있지만 다른 경우 (특히 이것이 아님)에서는 map을 사용하는 것이 "유일한"솔루션이 될 수 있습니다.
특히 표준 표현식이 아닌 정규 표현식을 사용하고 싶을 때.
이 경우 다음과 같습니다.
$('.myClass').filter(function(index, elem) {
var jElem = $(elem);
return jElem.closest('#Create').length > 0 ||
jElem.closest('#Edit').length > 0;
}).plugin(...);
이전에 말했듯이 여기서이 솔루션은 쓸모가 없지만 추가 문제에 대해서는 매우 좋은 옵션입니다.
참고 URL : https://stackoverflow.com/questions/5736811/multiple-selector-chaining-in-jquery
'development' 카테고리의 다른 글
쿠키의 만료 시간을 얻는 방법 (0) | 2020.12.10 |
---|---|
CakePHP 용으로 생성 된 기존 MySQL 데이터베이스에서 ER 다이어그램 생성 (0) | 2020.12.10 |
내 웹 사이트에서 Chrome 번역 바 사용 중지 (0) | 2020.12.10 |
Linux에서와 유사한 OS X의 약한 기호 별칭 또는 가장 유사한 별칭? (0) | 2020.12.09 |
일부 장치에 대한 UWP의 XAML 그라데이션 문제 (0) | 2020.12.09 |