자바 스크립트를 사용하여 요소 값을 동적으로 전달합니다.

Question

자바 스크립트가있는 클래스 이름의 버튼을 표시하는 루프가 있습니다. 클릭 한 범위의 ID를 전달해야합니다. 내 문제는 거기에 루프 때문에 색인에 의해 ID를 얻을 수 있지만 내가 얻고 싶은 것은 동적으로 클릭 한 단추의 ID입니다.

while(...){ 
    <span class="id">'.$table["id"].'</span> 
    <input type="button" class="edit" value="Edit"/> 
    } 


$('.edit').on('click', function (e) { 
    var x=document.getElementsByClassName("id")[0]; 
    var xx = x.innerHTML; 

     $.fancybox({ 
      ... 
     } 
     }); 
}); 

Answer 1

단지 $(this)을 사용할 수 있습니까? 클릭 이벤트 내에서? 당신은이 작업을 수행 할 필요가 없습니다 : 당신이 거기 당신의 요소에 이미 때문에

var x=document.getElementsByClassName("id")[0]; 

그냥

var x = $(this); 

말, 클릭 이벤트가 발생하면.

희망이 있습니다. :)

Answer 2

는

VAR X = $ (이) .closest ("범위")를 사용하려면 같은 소리;

클릭 한 버튼 옆에 스팬이 있어야합니다.

Answer 3

나는 변수를 전달하기 위해 data attributes과 함께 갈 것이므로 CSS 스타일 용 클래스 만 남겨 둘 수 있습니다. 또한 이미 jQuery를 사용하고 있다면 왜 그걸 가지고 가지 않을까요?

while(...){ 
<span class="id" data-id="id">'.$table["id"].'</span> 
<input type="button" class="edit" value="Edit" data-target="id"/> 
} 


$('.edit').on('click', function (e) { 
    var data = $(this).data('target'); // Get the data-target attribute 
    var target = $('*[data-id='+data+']'); // Find the matching span 
    var xx = target.html(); // Get HTML from Span 

    $.fancybox({ 
     ... 
    } 
    }); 
});