与jQuery找到正确的ListView控件的ClientID那里有在页面上多个列表视图 [英] Find with Jquery the correct ListView ClientID where there are more than one list view on the page

问题描述

在我的网站我有2 ListView的页面，每个列表视图包含多个div的和每个div我实现了点击事件，这样我就可以改变风格来选择的分区，但发生这两个列表视图的这个变化我怎样才能确保点击只有当DIV父列表视图会受到影响？这里是我的code：

 ＆LT; ASP：ListView控件ID =ListView1的=服务器＆GT;
 ＆LT;＆LayoutTemplate模板GT;
   ＆LT; D​​IV ID =itemPlaceholder=服务器＆GT;＆LT; / DIV＆GT;
 ＆LT; / LayoutTemplate模板＆GT;
  ＆LT;＆ItemTemplate中GT;
         ＆LT; D​​IV CLASS =盒子=服务器＆GT;＆LT; / DIV＆GT;
         ＆LT; D​​IV CLASS =selectedBox=服务器＆GT;＆LT; / DIV＆GT;
         ＆LT; D​​IV CLASS =盒子=服务器＆GT;＆LT; / DIV＆GT;
         ＆LT; D​​IV CLASS =盒子=服务器＆GT;＆LT; / DIV＆GT;
  ＆LT; / ItemTemplate中＆GT;
＆LT; / ASP：的ListView＆GT;    ＆LT; ASP：ListView控件ID =ListView2=服务器＆GT;
     ＆LT;＆LayoutTemplate模板GT;
       ＆LT; D​​IV ID =itemPlaceholder=服务器＆GT;＆LT; / DIV＆GT;
     ＆LT; / LayoutTemplate模板＆GT;
      ＆LT;＆ItemTemplate中GT;
             ＆LT; D​​IV CLASS =盒子=服务器＆GT;＆LT; / DIV＆GT;
             ＆LT; D​​IV CLASS =selectedBox=服务器＆GT;＆LT; / DIV＆GT;
             ＆LT; D​​IV CLASS =盒子=服务器＆GT;＆LT; / DIV＆GT;
             ＆LT; D​​IV CLASS =盒子=服务器＆GT;＆LT; / DIV＆GT;
      ＆LT; / ItemTemplate中＆GT;
    ＆LT; / ASP：的ListView＆GT;    ＆LT;脚本类型=文/ JavaScript的＆GT;
        $（箱子）。点击（函数（）{
        $（本）.siblings（）removeClass移除（selectedBox）;
        $（本）.addClass（selectedBox）;
        }）;
    ＆LT; / SCRIPT＆GT;
 

解决方案

我不认为有什么不对您的jQuery。看看我的测试在 http://jsfiddle.net/wehEH/ 。但是，您在使用layoutTemplate中的股利不会得到渲染。添加周围DIV的的ItemTemplate，你应该罚款。

in my website i have page with 2 listview's, each listview contain multiple div's and for each div i implement click event so i can change style to the chosen div but this changes occur to both of the listviews how can i make sure that when div is clicked only the parent listview will be affected? Here is my code:

<asp:ListView ID="ListView1" runat="server">
 <LayoutTemplate>
   <div id="itemPlaceholder" runat="server"></div> 
 </LayoutTemplate>
  <ItemTemplate>
         <div class="box" runat="server"></div> 
         <div class="selectedBox" runat="server"></div>
         <div class="box" runat="server"></div>
         <div class="box" runat="server"></div>
  </ItemTemplate>
</asp:ListView>

    <asp:ListView ID="ListView2" runat="server">
     <LayoutTemplate>
       <div id="itemPlaceholder" runat="server"></div> 
     </LayoutTemplate>
      <ItemTemplate>
             <div class="box" runat="server"></div> 
             <div class="selectedBox" runat="server"></div>
             <div class="box" runat="server"></div>
             <div class="box" runat="server"></div>
      </ItemTemplate>
    </asp:ListView>

    <script type="text/javascript">
        $(".box").click(function () {
        $(this).siblings().removeClass("selectedBox");
        $(this).addClass("selectedBox");
        });
    </script>

解决方案

I don't think there's something wrong with your jQuery. Take a look at my test at http://jsfiddle.net/wehEH/. However, the div you use in the Layouttemplate won't get rendered. Add a surrounding div in the ItemTemplates and you should be fine.

这篇关于与jQuery找到正确的ListView控件的ClientID那里有在页面上多个列表视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！