在JavaScript中更新div背景圖像

我發現了類似的例子，我在這裏嘗試完成，但我不確定我在做什麼錯誤。在JavaScript中更新div背景圖像

我有一個div有2個組件：背景圖片和5個標籤。

<div id="graph" class="graphs" style="display: block"> 
     <div id="chart"> 
     </div> 
     <div id="symbol" class="symbols"> 
      <div id="symbol1" class="ticker" onclick="showg()"></div> 
      <div id="symbol2" class="ticker" onclick="showg()"></div> 
      <div id="symbol3" class="ticker" onclick="showg()"></div> 
      <div id="symbol4" class="ticker" onclick="showg()"></div> 
      <div id="symbol5" class="ticker" onclick="showg()"></div> 
     </div> 
    </div>

我使用JavasScript如下：

var portfolios = [ 
{ "ticker1" : "LLNW", "ticker2" : "AOL", "ticker3" : "DATA", "ticker4" : "PUBN", "ticker5" : "YUME", }, ]; 
document.getElementById("symbol1").innerHTML = portfolios[0].ticker1; 
document.getElementById("symbol2").innerHTML = portfolios[0].ticker2; 
document.getElementById("symbol3").innerHTML = portfolios[0].ticker3; 
document.getElementById("symbol4").innerHTML = portfolios[0].ticker4; 
document.getElementById("symbol5").innerHTML = portfolios[0].ticker5; 

function showg(){ 
var currentTicker = this.innerText; 
document.getElementById("chart").style.backgroundImage= "url('"+ currentTicker +" - GRAPH.png')";}

我的圖片中的每一個被命名爲currentTicker-GRAPH.png（即LLNW-GRAPH.png）。

我想我正在做的是設置div的innerHTML我正在運行showg（）函數並將其稱爲currentTicker。然後，我嘗試使用+'-GRAPH.png'更改背景圖像樣式。（目前，我的圖像與我的.js，.css，.html文件都在同一個文件夾中）。

我很確定我正在做錯誤的currentTicker變量聲明...但不知道如何。

任何幫助將不勝感激。

來源

2014-02-06 digitaura

在你的showg（）函數中，你是什麼意思this.innerText（）？這是什麼' ？你是否嘗試登錄並看到它的價值？ – MJoraid

您需要的元素傳遞函數調用是這樣的：

onclick="showg(this)"

而且你的功能將是：

function showg(el) { 
    var currentTicker = el.innerText; 
    document.getElementById("chart").style.backgroundImage= "url('"+ currentTicker +" - GRAPH.png')"; 
}

因爲this代表的功能，而不是被點擊裏面的window元素元件。

來源

2014-02-06 15:54:53 Skwal

謝謝Skwal ...我的唯一問題是你的建議之後是「-GRAPH ...它不斷吐出％20'之間的空格 – digitaura

@digitaura是的，避免在Web上的文件名中放入空格，它們會被編碼。 – Skwal

在JavaScript中更新div背景圖像

回答

相關問題