programing

jID에 대한 jQuery selector가 특정 텍스트로 시작합니다.

padding 2023. 9. 25. 22:23
반응형

jID에 대한 jQuery selector가 특정 텍스트로 시작합니다.

jQuery 코드가 있습니다.

$( "#editDialog" ).dialog({
  autoOpen: false,
  show: {
    effect: "blind",
    duration: 1000
  },
  hide: {
    effect: "explode",
    duration: 1000
  }
});

하지만 이런 아이디를 가진 디브가 몇 명 있어요editDialog-0,editDialog-1, ....,editDialog-n.

위의 디브처럼 이 모든 디브에 대한 jQuery 코드를 만들려면 어떻게 해야 합니까?

속성 선택기로 jquery 사용 시작

$('[id^=editDialog]')

대체 솔루션 - 1 (적극 권장)

더 깨끗한 해결책은 각 div & use에 공통 클래스를 추가하는 것입니다.

$('.commonClass').

그러나 html 마크업이 사용자의 손에 있지 않고 어떠한 이유로 변경할 수 없는 경우 첫 번째 마크업을 사용할 수 있습니다.

대체 솔루션 - 2 (만약 권장되지 않는 경우)n is a large number) (@Mihai Stancu의 제안대로)

$('#editDialog-0, #editDialog-1, #editDialog-2,...,#editDialog-n')

참고: 셀렉터가 2개 또는 3개인데 목록이 변경되지 않으면 아마 이것이 실행 가능한 해결책이 될 것입니다. 하지만 시내에 새로운 ID가 생기면 셀렉터를 업데이트해야 하기 때문에 확장이 불가능합니다.

아직 언급하지 않았지만 유용할 것으로 생각되는 것들을 고려하여 좀 더 포괄적인 답변을 드리겠습니다.

당신의 현재 문제에 대한 답은.

$("div[id^='editDialog']");

캐럿(^)은 정규식 및 평균에서 가져온 것입니다.starts with.

해결책1

// Select elems where 'attribute' ends with 'Dialog'
$("[attribute$='Dialog']"); 

// Selects all divs where attribute is NOT equal to value    
$("div[attribute!='value']"); 

// Select all elements that have an attribute whose value is like
$("[attribute*='value']"); 

// Select all elements that have an attribute whose value has the word foobar
$("[attribute~='foobar']"); 

// Select all elements that have an attribute whose value starts with 'foo' and ends
//  with 'bar'
$("[attribute^='foo'][attribute$='bar']");

attribute위의 코드에서 요소가 가질 수 있는 속성으로 변경될 수 있습니다. 예를 들어,href,name,id아니면src.

솔루션2

클래스사용

// Matches all items that have the class 'classname'
$(".className");

// Matches all divs that have the class 'classname'
$("div.className");

솔루션3

목록 작성(이전 답변에도 나와 있음)

$("#id1,#id2,#id3");

해결책4

개선할 때 정규 표현식(실제로 이런 것을 사용한 적이 없고 해결책 하나면 항상 충분하지만 결코 알 수 없습니다!

// Matches all elements whose id takes the form editDialog-{one_or_more_integers}
$('div').filter(function () {this.id.match(/editDialog\-\d+/)});

설명한 대로 모든 div가 editDialog(편집 대화 상자)로 시작하는 경우 다음 선택기를 사용할 수 있습니다.

$("div[id^='editDialog']")

아니면 당신이 더 편하다면 대신 클래스 선택기를 사용할 수도 있습니다.

<div id="editDialog-0" class="editDialog">...</div>

$(".editDialog")

모든 div에 공통 클래스를 추가합니다.예를 들어 모든 디브에 foo를 추가합니다.

$('.foo').each(function () {
   $(this).dialog({
    autoOpen: false,
    show: {
      effect: "blind",
      duration: 1000
    },
    hide: {
      effect: "explode",
      duration: 1000
    }
  });
});

언급URL : https://stackoverflow.com/questions/23223526/jquery-selector-for-id-starts-with-specific-text

반응형