быстрый способ найти элемент с JQuery

Question

Учитывая следующий HTML:

<tr> 
     <td>Content</td> 
     <td>Content</td> 
     <td>Content</td> 
     <td><img id="imgProductPurchased" runat="server" visible="true" alt="Product Purchased" title="Product Purchased" src="/sitecore/shell/Themes/Standard/Applications/16x16/checkbox.png" /></td> 
     <td> 
      <asp:PlaceHolder ID="plhPurchased" runat="server"> 
       <span class="roundButton roundButtonLarge"><a id="hypPurchased" class="registryPurchased" href="#" title="Mark product as purchased" runat="server"><span> 
       <em class="registryPurchased"></em>Purchased</span></a> <span class="buttonEndLarge"> 
       </span></span> 
      </asp:PlaceHolder> 
     </td> 
    </tr> 
      <tr> 
        Repeats above 
      </tr> 

У меня есть событие нажмите на кнопку «hypPurchased». Когда это событие срабатывает, мне нужно получить доступ к элементу plhPurchased и элементам imgProductPurchased из строки THAT.

EDIT:

мне заявили, что это строится с помощью ASP.NET, и, как таковые, идентификаторы являются уникальными.

Answer 1

Если событие click находится в конкретной строке, а элемент является дочерним элементом этой строки, вы можете использовать контекст для получения результата.

$(".myRow").click(function() { 
    var somethingFromMyRow = $(".myChildClassName", this).text(); 
    alert(somethingFromMyRow); 
}); 

Пожалуйста, обратите внимание, что вы не должны дублировать тот же идентификатор в любом месте на странице, поэтому пример я снабдил использует имя класса, а - так что представьте, у вас есть HTML, как это для примера.

<tr class="myRow"> 
    <td><span class="myChildClassName">Some Text In Row 1</span></td> 
    <td>More Stuff</td> 
</tr> 
<tr class="myRow"> 
    <td><span class="myChildClassName">Some Text In Row 2</span></td> 
    <td>More Stuff</td> 
</tr> 
<tr class="myRow"> 
    <td><span class="myChildClassName">Some Text In Row 3</span></td> 
    <td>More Stuff</td> 
</tr> 

Answer 2

id «s не может быть повторен в HTML,

Во всяком случае, то, что вам нужно сделать, это добраться до родительского элемента (идти вверх по иерархии, пока вы не получите родительский элемент, который охватывает «текущий» строка), а затем выполнить запрос против него:

jQuery(your_query_string, parent) 

Где родитель то, что вы можете получить с помощью:

parent = query.parent() 

Например:

function click_handler(element) 
{ 
    parent = jQuery(element).parent() 
    name = jQuery(".name", parent) 
    // do stuff 
} 

name = jQuery(".name", parent) получит все элементы с классом name под parent элемента.

Answer 3

has Hasen сказал, вы не можете дублировать id в html.

так, применить класс "plhPurchased", а затем:

на hypPurchased вы положили OnClick = "yourFuntion (это)"

function yourFuntion(elem) 
{ 
    var tr=$(elem).closest('tr'); 
    var _imgProductPurchased = tr.find('img'); 
    // if you have more then a img per row, you should apply a class to the image to and get it by: 
    // tr.find('.imgClass'); 
    var _plhPurchased=tr.find('.thatClassYouApplyed'); 
}