Управление ретранслятором Asp.Net с помощью javascript

Question

Я создал страницу часто задаваемых вопросов, используя Repeater Control, вопросы и ответы связаны с временем выполнения кода, следующим за ним.

ASPX код

<asp:Repeater ID="RepDetails" runat="server"> 
<ItemTemplate> 
<table id="tblRepeater"> 
    <tr id="QARow" runat="server"> 
     <td> 
     <div id="QuestionDiv" onclick="return show(this, 'AnswerDiv');"> 
     Q:<asp:label id="lblQuestion" runat="server" Text='<%# Eval("Question")%>' CssClass="lblQueClass"></asp:label> 
     </div> 
     <div id="AnswerDiv" style="display:none;"> 
     Ans:<asp:Label id="lblAnswerClass" runat="server" Text='<%# Eval("Answer")%>' CssClass="lblAnswerClass"></asp:Label> 
     </div> 
     </td> 
    </tr> 
    </ItemTemplate> 
    <FooterTemplate> 
</table> 
    </FooterTemplate> 
</asp:Repeater> 

Это прекрасно работает! Дело в том, что я использовал следующий скрипт для открытия и закрытия ответа.

<script type="text/javascript"> 
    function show(QuestionDiv, AnswerDiv) { 
    var arrDIVs = QuestionDiv.parentNode.getElementsByTagName("Div"); 
    for (var i = 0; i < arrDIVs.length; i++) { 
     var oCurDiv = arrDIVs[i]; 
     if (oCurDiv.id.indexOf(AnswerDiv) >= 0) { 
      var blnHidden = (oCurDiv.style.display == "none"); 
      oCurDiv.style.display = (blnHidden) ? "block" : "none"; 
      } 
     } 
     return false; 
    } 
</script> 

Он работает, как при нажатии на один вопрос. Он показывает ответ на этот вопрос.

Мой вопрос: Я хочу обновить сценарий, когда мы нажимаем на один конкретный вопрос, Он должен отображать ответ на этот вопрос, также он должен скрывать ответ другого вопроса (например, http://www.edubrainschool.com/faq.php).

Answer 1

Лучший способ для этого - связать клик этого TR. Вы можете сделать это, применив css к TR.

<asp:Repeater ID="RepDetails" runat="server"> 
<ItemTemplate> 
<table id="tblRepeater"> 
    <tr id="QARow" runat="server" class="TROpenCSS"> 
     <td> 
     <div id="QuestionDiv" class="QuestionCSS" onclick="return show(this, 'AnswerDiv');"> 
     Q:<asp:label id="lblQuestion" runat="server" Text='<%# Eval("Question")%>' CssClass="lblQueClass"></asp:label> 
     </div> 
     <div id="AnswerDiv" class="AnswerCss" style="display:none;"> 
     Ans:<asp:Label id="lblAnswerClass" runat="server" Text='<%# Eval("Answer")%>' CssClass="lblAnswerClass"></asp:Label> 
     </div> 
     </td> 
    </tr> 
    </ItemTemplate> 
    <FooterTemplate> 
</table> 
    </FooterTemplate> 
</asp:Repeater> 

И связывает щелчок событие того CSS

$('.TROpenCSS').bind('click',function(){ 
// Do your code to show the TD 
}); 

Добавить другую привязку для всех кликов/при наведении курсора мыши

Или вы можете использовать «ddaccordion.js» или обратитесь к следующим link