Получить идентификатор динамически

Question

У меня есть вертикальная вкладка для каждой вкладки, где div открывается по ID. Три DIV-х, как следует

HTML из DIV

<div id="About-content" class="contentblock"> 
    <h1 class="Abouthead">About RBL Bank</h1> 

    <img src="images/common/rbl-bank-logo.jpg" alt="RBL Bank" class="Logos" /> 
    <p class="Aboutuspara">....</p> 
    <p class="Aboutuspara">....</p> 
    <p class="Aboutuspara">....</p> 
</div> 
<!-- @end #home-content --> 
<div id="Iksha-content" class="contentblock hidden"> 
    <h1 class="Abouthead">Iksha Foundation</h1> 

    <img src="images/CRS/Ourpartners/ikshafoundation.png" class="Logos" /> 
    <p class="Aboutuspara">...</p> 
    <p class="Aboutuspara">...</p> 
    <p class="Aboutuspara">...</p> 
</div> 
<!-- @end #about-content --> 
<div id="Iimpact-content" class="contentblock hidden"> 
    <h1 class="Abouthead">Iimpact Foundation</h1> 

    <img src="images/CRS/Ourpartners/IImpact.png" 
      alt="Iimpact Foundation" class="Logos" /> 
    <p class="Aboutuspara">...</p> 
    <p class="Aboutuspara">...</p> 
    <p class="Aboutuspara">...</p> 
</div> 

и мои закладки приходят из таблицы базы данных, я хочу, когда

Iimpact-контент щелкают только что DIV должен быть открыт, для этого я написал код, но проблема в том, что, как получить идентификатор динамически при нажатии

<asp:ListView ID="lstAbout" runat="server"> 
    <LayoutTemplate> 
     <asp:PlaceHolder ID="itemPlaceHolder" runat="server"> 
     </asp:PlaceHolder> 
    </LayoutTemplate> 
    <ItemTemplate> 
     <li> 
      <%--I want ID to be set dynamically to the anchor tag--%> 
      <a href=""><%#Eval("ngo_name") %></a> 
     </li> 
    </ItemTemplate> 
</asp:ListView> 

Кроме того, моя JQuery для шкуры и шоу, как следует: -

$('#sidemenu a').click(function (e) { 
    e.preventDefault(); 

    if ($(this).hasClass('open')) { 
     // do nothing because the link is already open 
    } else { 
     var oldcontent = ".contentblock"; //$('#sidemenu a.open').attr('href'); 
     var prev = $('#sidemenu a.open').attr('href'); 
     var newcontent = $(this).attr('href'); 
     $(oldcontent).hide(); 
     $(newcontent).fadeIn().removeClass('hidden'); 

     $('#sidemenu a').removeClass('open'); 
     $(this).addClass('open'); 
    } 
}); 

или предложить, пожалуйста, если есть другой способ .. !!

Answer 1

Если вы используете веб-контроль гиперссылке в вашем ListView с ClientIDMode к предсказуемым:

<asp:HyperLink 
ID="HyperLink" 
NavigateUrl="http://www.stackoverflow.com" 
Text='<%#Eval("ngo_name") %>' 
ClientIDMode="Predictable" 
runat="server" /> 

Это должно оказывать идентификаторы следующим образом:

<a id="HyperLink0" href="">Link 1</a> 
<a id="HyperLink1" href="">Link 2</a> 
<a id="HyperLink2" href="">Link 3</a> 

Как и выше число будет автоматически увеличиваться начиная с нуля.

Если вы хотите использовать вкладку идентификатор из базы данных вместо этого вы можете просто добавить ClientIDRowSuffix свойства и установить его свойство:

<asp:HyperLink 
ID="HyperLink" 
NavigateUrl="http://www.stackoverflow.com" 
Text='<%#Eval("ngo_name") %>' 
ClientIDMode="Predictable" 
ClientIDRowSuffix="TabId" 
runat="server" /> 

Вы могли бы получить идентификатор из вашего JQuery клика обработчика как следующим образом:

var id = $(this).attr('id'); 

ListView с гиперссылкой

<asp:ListView ID="lstAbout" runat="server"> 
     <LayoutTemplate> 
      <asp:PlaceHolder ID="itemPlaceHolder" runat="server"</asp:PlaceHolder> 
     </LayoutTemplate> 
     <ItemTemplate> 
      <li> 
        <asp:HyperLink 
        ID="HyperLink" 
        NavigateUrl="http://www.stackoverflow.com" 
        Text='<%#Eval("ngo_name") %>' 
        ClientIDMode="Predictable" 
        runat="server" /> 
      </li> 
     </ItemTemplate> 
    </asp:ListView> 

Update

Если вы используете код выше, то HyperLink идентификаторы будут оказывать следующим образом (упрощен для демонстрации):

<a id="HyperLink0" href="">Link 1</a> 
<a id="HyperLink1" href="">Link 2</a> 
<a id="HyperLink2" href="">Link 3</a> 

Следующий JavaScript может быть использован для отображения желаемого контента DIV.:

$(function(){ 
    // Initially hide all but show first one 
    $('.contentblock').hide(); 
    $('.contentblock :first').show(); 

    $('a').click(function (e) { 
    e.preventDefault(); 
    // hide all 
    $('.contentblock').hide(); 
    var id = $(this).attr('id'); 
    // get the div number to show 
    var numberedDiv = parseFloat(id.replace("HyperLink", "")) 

    var divToShow = $('.contentblock')[numberedDiv]; 
    $(divToShow).show(); 
    }) 

}); 

jsFiddle

Answer 2

HTML5 вы могли бы сделать что-то вроде

<a href="" data-tag="your tags"></a> 

В функции мыши Jquery

$tag = $(this).data('tag'); 

или

$tag = $(this).data().tag; 

Answer 3

Использование ниже подход, это помогло бы

$('.Iimpact-content').live('click',function(){ 
var elementID=this.ID; 
});