背景圖像不顯示

創建動態以下項目：背景圖像不顯示

 var newItem = '<div title="' + elem.IP + '" id="' + elem.Alias + '-Status" class="elementStatus"><div class="image" id="' + elem.Alias + '-StatusImg" style="height:40px; background-image: ' + '@Url.Content("~/images/ongoing.gif")' + '"></div><div id="' + elem.Alias + '-StatusTxt" class="text">Waiting...</div></div>';

然後我設置DIV背景圖像動態地以及通過執行：

$('#' + elem.Alias + '-StatusImg').css("background-image", '@Url.Content("~/images/ongoing.gif")');

但背景圖像的div（ elem.Alias +'-StatusImg'）不顯示。有任何想法嗎？

來源

2013-10-29 user1624552

沒有什麼特別不妥你的JavaScript，假設元素被發現，圖像的URL是正確的。在控制檯中試試'$（'＃'+ elem.Alias +'-StatusImg'）.length'，它應該是'1'。 –

@RoryMcCrossan我已經嘗試過你說過的話。控制檯輸出爲1，但不顯示背景圖像。 – user1624552

您需要在背景的CSS規則中指定url(x)。試試這個：

$('#' + elem.Alias + '-StatusImg').css("background-image", 'url("@Url.Content("~/images/ongoing.gif")")');

或者這樣：

var newItem = '<div title="' + elem.IP + '" id="' + elem.Alias + '-Status" class="elementStatus"><div class="image" id="' + elem.Alias + '-StatusImg" style="height:40px; background-image: url(@Url.Content("~/images/ongoing.gif))"></div><div id="' + elem.Alias + '-StatusTxt" class="text">Waiting...</div></div>';

Example fiddle

來源

2013-10-29 14:39:07

它像一個魅力，但除了在一種情況下：initialy我設置背景圖像與您的第一個選項，然後在某一點上，我執行一個ajax調用，當通話返回好的時候，我應該再次更新背景圖像，所以我再次使用你的第一個選項，但在最後一種情況下，它不工作，有什麼想法？（也許最好爲此打開另一個線程？） – user1624552

可能對另一個線程更好，雖然沒有理由不能重新使用同一行代碼。確保你在新的問題中包含你的AJAX代碼。 –

幾小時前我發佈了另一個帖子。我使用的是img而不是background-image，而且我遇到了這個問題。所以我決定使用div的背景圖片，但我看到我仍然有同樣的問題。看到下面的線程：http://stackoverflow.com/questions/19658935/image-not-loading-during-heavy-process-ongoing請注意，在setImgTestPassed /失敗現在我有你在第一個選項中說過的行。 – user1624552

背景圖像不顯示

回答

相關問題