一尘不染

通过功能和功能参数的Java设置DIV的背景图像

css

我有以下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>

以及以下Javascript:

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

当我尝试通过调用getElementByID设置选项卡背景图像时,就会出现问题-
我现在知道如何创建一个动态URL,该URL使用传入的参数以及其他一些硬编码值。在这种情况下,我们将OFF背景图像与ON背景图像交换。

我怎样才能做到这一点?有什么方法可以使用javascript变量,为其分配完整路径,然后将其作为背景图像路径发送到调用中?


阅读 213

收藏
2020-05-16

共1个答案

一尘不染

您需要连接字符串。

document.getElementById(tabName).style.backgroundImage = 'url(buttons/' + imagePrefix + '.png)';

使用它的方式只是创建一个长字符串,而不实际解释imagePrefix。

我什至建议创建单独的字符串:

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

如下面的DavidThomas所提到的,您可以在字符串中使用双引号。

2020-05-16