0

ItemTemplate にデータをリストしています。その後、ItemTemplate 内に、次の 2 つの 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>

次に、ページが読み込まれると、ユーザーが contentdiv リンクをクリックするまで、この div タグのデータが非表示になるように、hideAll クラスを定義する css があります。

    .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では、1 つの要素を参照するために使用されます。
複数回使用すると、ブラウザはデフォルトで最初の要素になります。

クラスセレクターを使用する必要があります。何かのようなもの：

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

これが実際の例です。私は toggleClass を使用しましたが、それは私にとってより適切なようです。

于 2013-06-26T09:28:39.663 に答える
3

ID は一意の識別子です。同じページに同じ識別子を持つ 2 つ以上のものを配置して、適切に機能することを期待することはできません。識別子を一意にして、代わりにクラス セレクターを使用してクリック イベントにバインドします。

于 2013-06-26T09:28:13.683 に答える
0

id の代わりに class を使用する必要があります。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 に答える