Javascript Ustawianie obrazu tła DIV za pomocą parametru funkcji i funkcji

Question

Mam następujące HTML:

<div id="tab1" style="position:relative; background-image:url(buttons/off.png); 
    <a href="javascript:ChangeBackgroundImageOfTab('tab1', 'on');"> 
     <img id="DivBtn1" name="DivBtn1" src="buttons/text.png" > 
    </a> 
</div> 

oraz następujące javascript:

function ChangeBackgroungImageOfTab(tabName, imagePrefix) 
{ 
    document.getElementById(tabName).style.background-image= 'url("buttons/" + imagePrefix + ".png")'; 
} 

Problem powstaje, gdy próbuję ustawić obraz tła kart poprzez wywołanie getElementByID - teraz wiem, jak utworzyć dynamiczny adres URL, który używa parametru, który został przekazany, wraz z niektórymi innymi zakodowanymi wartościami. W tym przypadku zamieniamy obraz tła OFF na obraz w tle.

Jak mogę to zrobić? Czy istnieje jakiś sposób użycia zmiennej javascript, przypisanie jej pełnej ścieżki, a następnie wysłanie jej do wywołania jako ścieżki obrazu tła?

Answer 1

Konieczne jest połączenie łańcucha.

Sposób, w jaki to zrobiłeś, tworzy tylko jeden długi ciąg i właściwie nie interpretuje imagePrefix.

bym nawet sugerują, tworząc ciąg oddzielone: ​​

function ChangeBackgroungImageOfTab(tabName, imagePrefix) 
{ 
    var urlString = 'url(buttons/' + imagePrefix + '.png)'; 
    document.getElementById(tabName).style.backgroundImage = urlString; 
} 

Jak wspomniano poniżej David Thomas, można rów cudzysłów w ciąg. Oto mały artykuł, aby uzyskać lepszy pomysł, jak ciągi i cytaty/cudzysłowy związane są: http://www.quirksmode.org/js/strings.html

Answer 2

Z tego co wiem, poprawna składnia jest następująca:

function ChangeBackgroungImageOfTab(tabName, imagePrefix) 
{ 
    document.getElementById(tabName).style.backgroundImage = "url('buttons/" + imagePrefix + ".png')"; 
} 

Więc zasadniczo getElementById(tabName).backgroundImage i podzieliła ciąg znaków:

"cssInHere('and" + javascriptOutHere + "/cssAgain')";