0

我在 ItemTemplate 中列出我的数据。然后在 ItemTemplate 中，我有两个 div 标签，如下所示：

   <ItemTemplate>
     <div id="contentdiv">
       <h4 id="titleresult"><a href="#"  onclick="showResults(<%#Eval("UserID")%>);return false;" class="title"><%# Server.HtmlEncode(Eval("Name").ToString())%></a></h4>
     </div>

     <div id="showclick" class=hideAll>
       <p class="brief"><%# Server.HtmlEncode(Eval("LegalName").ToString())%></p>
       <p class="brief"><%# Server.HtmlEncode(Eval("FirstName").ToString())%></p> 
       <p><%# Server.HtmlEncode(Eval("LastName").ToString())%></p>
     </div>
   </ItemTemplate>

然后我有 css 来定义 hideAll 类，以便在页面加载时，隐藏此 div 标记中的数据，直到用户单击 contentdiv 链接。

    .hideAll  { display:none }
    .displayAll { display:block; top:0px}

然后最后我有了触发点击事件的javascript部分。

  <script type="text/javascript">
    function showResults(UserID) {
        var contentdiv= document.getElementById('contentdiv');
        var showclick = document.getElementById('showclick');

        <%
        long id =0;
        DataAccess dataAccess = new DataAccess();
        Data = dataAccess.GetCounterParty(id);

        %>
        var UserID = <%=dataAccess.GetCounterParty(id) %>
        contentdiv.style.visibility = "visible";
        $(showclick).removeClass('hideAll');
         }
  </script>

UserID 是列表中每个元素的 ID。问题是，无论我在列表上单击哪个其他元素，单击都只会影响第一个元素。

4

3 回答 3

4

在 htmlid中用于引用一个元素。
如果您多次使用它，浏览器将默认使用第一个元素。

您应该使用类选择器。就像是：

$(".contentdiv").click(function(){
  $(this).next().removeClass('hideAll');
});

这是一个工作示例。虽然我使用了 toggleClass，但它似乎更适合我。

于 2013-06-26T09:28:39.663 回答
3

id 是一个唯一标识符，您不能在同一页面上拥有两个或多个具有相同标识符的东西，并期望它们能够正常工作。使您的标识符唯一，并使用类选择器绑定到单击事件。

于 2013-06-26T09:28:13.683 回答
0

你应该使用class而不是id，id是唯一的，它只存在于1个页面中，class可以存在于多个div中

给你一些想法

html
<div class="showclick hideAll">

script
$('.showclick').on('click', function(){
  $(this).toggle(); //toggle to show or hide, can be any element u want to toggle instead of this
});
于 2013-06-26T09:35:11.537 回答