2017-04-24 82 views
0

我正在購物車應用程序中,我列出了所有產品在ListView中。然後點擊每個產品的按鈕,圖像滑塊就會變化。現在我想讓鼠標懸停而不是點擊。以下是我試圖實現的代碼。如何調用c#按鈕點擊鼠標

ASP

<div class="col-md-12 "> 
       <div class="col-md-4 single_left pull-left"> 
        <div class="flexslider"> 
         <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> 
          <ContentTemplate> 
           <asp:Repeater runat="server" ID="Repeater"> 
            <HeaderTemplate> 
             <ul class="slides"> 
            </HeaderTemplate> 
            <ItemTemplate> 
             <li data-thumb='<%# "assets/products/"+DataBinder.Eval(Container.DataItem, "Image1") %>'> 
              <asp:Image ID="image5" runat="server" 
               ImageUrl='<%# "assets/products/"+DataBinder.Eval(Container.DataItem, "Image1") %>' /> 
             </li> 
            </ItemTemplate> 
            <FooterTemplate> 
             </ul> 
            </FooterTemplate> 
           </asp:Repeater> 
          </ContentTemplate> 
         </asp:UpdatePanel> 
        </div> 
        <script defer src="assets/js/jquery.flexslider.js"></script> 
        <link rel="stylesheet" href="assets/css/flexslider.css" type="text/css" media="screen" /> 
        <!-- FlexSlider --> 
        <div class="caption"> 
         <strong> 
          <asp:Label ID="lblPrice" runat="server" Text="*"></asp:Label></strong> 
         <strong> 
          <asp:Label ID="ItemCode" runat="server" Text="*"></asp:Label></strong> 
         <p> 
          <small><strong> 
           <asp:Label ID="lblDesc" runat="server" Text="*"></asp:Label> 
          </strong></small> 
          <br /> 
          <asp:Label ID="lblID" Style="display: none;" runat="server" Text='<%# Eval("ID") %>'></asp:Label> 
          <small> 
           <asp:Label ID="lblMsg" runat="server" Text="*" ForeColor="#990000"></asp:Label> 
          </small> 
          <br /> 
         </p> 
         <asp:TextBox ID="txtqty" type="number" class="form-control" Text="0" runat="server"></asp:TextBox> 
        </div> 
        <asp:LinkButton ID="btnSubmit" type="submit" CssClass="add-cart item_add" runat="server" OnClick="btnSubmit_Click"><i class="fa fa-save"></i> Add to Cart</asp:LinkButton> 
        <script> 
         // Can also be used with $(document).ready() 
         $(window).load(function() { 
          $('.flexslider').flexslider({ 
           animation: "slide", 
           controlNav: "thumbnails" 
          }); 
         }); 
        </script> 
       </div> 
       <div class="col-md-8 single-top-in simpleCart_shelfItem"> 
        <asp:ListView ID="ImagesList" runat="server" 
         DataKeyNames="ID" 
         GroupItemCount="15" 
         OnPagePropertiesChanging="ImagesList_PagePropertiesChanging" OnSelectedIndexChanged="OnSelectedIndexChanged"> 
         <EmptyDataTemplate> 
          No Images found. 
         </EmptyDataTemplate> 
         <LayoutTemplate> 
          <table> 
           <tr runat="server" id="groupPlaceholder" /> 
          </table> 
         </LayoutTemplate> 
         <GroupTemplate> 
          <tr> 
           <td runat="server" id="itemPlaceholder" /> 
          </tr> 
         </GroupTemplate> 
         <ItemTemplate> 
          <td> 
           <asp:LinkButton ID="LBtn" runat="server" 
            CommandName="Change" 
            OnCommand="btnDetails_Command" 
            CommandArgument='<%# Eval("Notes") %>'> 
            <img src='<%#"assets/products/"+Eval("ImageUrl").ToString() %>' class="image" style="Width:50px;Height:50px" alt="Change" onmouseover="this.OnCommand" /> 
           </asp:LinkButton> 
          </td> 
         </ItemTemplate> 
        </asp:ListView> 
       </div> 
       <div class="clearfix"></div> 
       <!----> 
      </div> 

回答

2

我必須說,你mouseovering觸發點擊的方法 - 似乎不是合適的解決方案。 (隨便說)

反正 - 你的代碼更改爲:

<asp:LinkButton ... CssClass="myButton" 
    ...     
</asp:LinkButton> 

然後,通過jQuery(你已經使用):

$(function(){ 
    $(".myButton").on('mouseover',function(){this.click()}); 
}); 
+0

是否有任何其他的方式來達到同樣的有300多種產品,每種產品都有3張圖片,每張圖片都可以在幻燈片中展示。當鼠標懸停時,我有要求更改滑塊中的圖像。我對這件事很陌生,所以這是我唯一的想法。 – Developer

+0

是的,我嘗試過,正如你所說的,這並不理想。該頁面正在跳過每個鼠標。我應該尋找一些替代品。任何方式感謝您的幫助.. – Developer

+1

@Developer使用ajax或FW庫像角/骨幹。 (不更新面板)。 –