1

我目前在我的 URL 中使用查询字符串来指示产品选择。我使用此功能使产品选择出现在将提交到我们网站的隐藏文本框中:

function getQueryVariable(key) {
    var query = window.location.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split("=");
        if (decodeURIComponent(pair[0])== key) {
            return decodeURIComponent(pair[1]);
        }
    }
}

var product = getQueryVariable('product');
document.getElementById("00NK0000000Yqv2").value = product;

我还需要根据 URL 查询字符串中指示的产品显示标题图像。我有四种产品(制造、建筑、专业和通用)。

我怎样才能做到这一点,如果 url 类似于:www.foo.com?product=Construction它显示构造标题,或者如果它是www.foo.com?product=Manufacturing,则显示制造。

4

3 回答 3

2

您可以像这样更改图像的来源:

document.getElementById("headerImg").src = 'header' + product + '.jpg';

图像将具有相同 ID 的位置,如下所示:

<img id="headerImg" src="images/headerImg.jpg">
于 2012-11-21T21:10:51.447 回答
0

您可以将元素的 css 类更改为您的产品名称,并替换 CSS 中的背景图像。例如,如果您的标头元素有一个 id = 标头,那么使用 jquery 时它看起来像这样。

$('#header').addClass(product); //product是你的变量

然后在你的 CSS 中,你可以这样设置它的样式:

#header {背景图像:url(pathToDefaultImage)}

#header.Manufacturing {背景图像:url(pathToManufacturingImage)}

于 2012-11-21T21:11:22.213 回答
0

是的,您可以按照与设置相同的方式来执行此操作value-src根据您的查询变量设置图像的属性。

就像是:

var image;
if (product === 'Construction') image = 'your_construction_image.png';
// more cases

document.getElementById('yourimageID').src = image;

然而,更好的方法是使用您的服务器端语言来呈现您想要的 HTML,而不是在之后使用 JavaScript 进行设置。

于 2012-11-21T21:12:39.460 回答