selector + text의 id를 포함하는 요소를 찾으십시오.

Question

이 작업을 수행하는 방법에 대해 혼란 스럽습니다.

내 페이지는 PHP를 사용하여 데이터베이스에서 제품 코드를 가져 와서이를 사용하여 요소에 대한 ID를 생성합니다. 예 : $("#touch-'.$productcode.'") 및 $("#popup-'.$productcode.'")

jQuery는 요소를 클릭 할 때 선택기 ID의 마지막 11 자와 추가 텍스트가 포함 된 요소를 문서에서 찾습니다.

예컨대 선택자 $(this) (생성 된 ID가 #touch-123-456-789 인)은 고유 한 ID를 가지며 마지막 11 자 (제품 코드)를 제외한 모든 것을 제거하고 popup-을 처음에 추가 한 다음 요소 $("#popup-123-456-789")을 찾고 작업을 수행합니다.

Answer 1

어떻게이 같은 몇 가지에 대한 ...

<div class='touch' id='touch-123-456-789'> bla bla </div> 

당신의 JQuery와에가

$('.touch').click(function(){ 
var id = $(this).attr('id'); 
id = id.substring(5); 

$('#popup' + id).doSomething(); 

}); 

Answer 2

이이 당신의 jQuery를

$(".pop-up").click(function(){ 
    var value = $(this).attr("value"); 
    var yourElement = "popup-"+value; 
    $("#"+yourElement).doSomething(function() { 
    }); 
}); 

당신의 HTML을

<div class="pop-up" value= "123-456-789">one</div> 
<div class="pop-up" value="123-123-123">two</div> 

입니다

Answer 3

같은 귀하의 ID를 파괴하려고 :

$('.touch').click(function() { 
    var id = $(this).attr('id'); 
    id = id.split(/-(.+)?/)[1]; 
    $('#popup-' + id).html("Hello changed"); 

}); 

.split() 여기를 처음 발견에 분할합니다 "-". 그래서 당신은 이것으로 무엇이든 할 수 있습니다.

<div class='touch' id='touch-123-456-789'> Touch me </div> 
<div class="popup" id="popup-123-456-789"></div> 

Answer 4

이 도움이 될 : 는 HTML 코드에서 두 가지 요소가 있다고 가정 할 수 있습니다. http://jsfiddle.net/79yut/

HTML :

<div class="element" id="#touch-123-456-790">Sample element1</div> 
<div class="element" id="#touch-123-456-791">Sample element2</div> 
<div class="element" id="#touch-123-456-792">Sample element3</div> 
<div class="element" id="#touch-123-456-793">Sample element4</div> 
<div class="element" id="#touch-123-456-794">Sample element5</div> 

JS :

for (i = 0; i <= $(".element").length; i++) { 
    if (i < $(".element").length) { 
     var id = $(".element").eq(i).attr("id"); 
     id = "popup-" + id.substring(7); 
     $(".element").eq(i).attr("id", id); 
    } else { 
     $("#popup-123-456-792").css('color','blue'); 
    } 
}