ASP.NET Repeater控件在Firefox中不工作

我有一個使用Repeater控件顯示縮略圖畫廊ASP.NET應用程序。當用戶將鼠標放在其中一個縮略圖上時，主圖像將顯示該縮略圖。

它在這樣的用戶控件使用Repeater控件：

<asp:Image ID="pictureImage" runat="server" Visible="true" Width="200px" /> 
<asp:Repeater ID="rpProductImages" runat="server" Visible="false"> 
    <ItemTemplate> 
     <div> 
      <div style="float: left" id="smallImage" runat="server"> 
       <div class="smallAltImage" onmouseover="showImage();" 
        style="border: 1px solid #999999; margin: 5px 5px 5px 4px; 
        width: 45px; height: 45px; background-position: center; background-repeat: no-repeat; 
        background-image: url('<%#ResolveClientUrl(productImagesPath)%><%# String.Format("{0}", DataBinder.Eval(Container.DataItem, "ImageName")) %>');"> 
       </div> 
       <asp:Label ID="lblImageName" runat="server" Visible="false"><%# Eval("ImageName")%></asp:Label> 
      </div> 
     </div> 
    </ItemTemplate> 
</asp:Repeater>

然後，在JavaScript文件，這樣的：

function showImage(){ 
    // Get thumbnail path. 
    var img = (this.style.backgroundImage).substring(4, (this.style.backgroundImage).length - 1); 
    $('#ctl00_ContentPlaceHolder1_ProductDetails1_pictureImage').attr('src', img); 
}

它工作正常，在IE9中，顯示完全合格的路徑爲圖像。然而，在FireFox8中，img src看起來像這樣：「」ProductImages/K42JY_500.jpg「」...帶兩套引號！

我認爲Repeater控件是問題的中心原因，但我再次谷歌搜索和谷歌搜索，並找不到任何人遇到過類似的情況！

來源

2011-11-29 Hyland Computer Systems

你也可以說是爲頁面在FireFox中生成的完整的HTML？ – JohnFx

您不應該猜測中繼器會生成什麼ID，然後對此進行硬編碼。 ASP.NET 4支持更多的預測性名稱生成，或者您可以使用CSS類。

另外，除非這個函數被調用作爲一個對象的方法，this將等於全局對象，我懷疑是你想要的。

function showImage(){ 
    // Get thumbnail path. 
    var img = (this.style.backgroundImage).substring(4, (this.style.backgroundImage).length - 1); 
    $('#ctl00_ContentPlaceHolder1_ProductDetails1_pictureImage').attr('src', img); 
}

來源

2011-11-29 01:44:10

我實際上自己修復了它。呼！出汗，我可能不得不給多個人的錢！基本上，我只是在var img代碼行中使用5和2來取消進攻性引號。儘管如此，感謝所有寫過的窺視者！你這個地方這麼好的原因。 –

@RobertHyland當然 - 很高興你的工作。如果這些答案中的任何一個都有幫助，請隨時接受或注意他們 - 現在您可以在此問題的+1之後執行此操作:) –

我不認爲ASP.NET Repeater是問題所在。它可以是您的ItemTemplate標籤中的HTML，JavaScript本身，也可以是IE和Firefox之間的區別。

首先，用HTML驗證器驗證輸出的HTML。解決任何問題。然後在Firefox中調試您的JavaScript，看看它在做什麼。也許firefox在this.style.backgroundImage的值中包含雙引號。

而且，使這個：

<%# String.Format("{0}", DataBinder.Eval(Container.DataItem, "ImageName")) %>

這樣簡化

<%# DataBinder.Eval(Container.DataItem, "ImageName") %>

來源

2011-11-29 01:44:49 slolife

關於中繼器的約定不是問題，因爲中繼器是服務器端控制，所以瀏覽器在使用中沒有任何影響。 – Skuld

+1'background-image：url（''）'內有單引號，由於'String.Format'產生'background-image（'「...」'），所以asp輸出也是雙引號。 '。你發現這個正確。我不確定您的答案是否可以解決問題，但它肯定可以改進OP代碼。 – Bazzz

ASP.NET Repeater控件在Firefox中不工作

回答

相關問題