如何使用jQuery在特定页面上更改图像？

问题描述：

好吧，我学会了如何删除特定页面上的元素，并允许它们出现在其他页面上。我认为我可能能够将相同的原理应用于图像。如何使用jQuery在特定页面上更改图像？

我有一个横幅图像，我想让它在多个页面上有所不同，现在不必为每个页面构建一个全新的页面包装器（我使用称为Luminate的CMS），或者学习它们自己的编程语言是混乱的地狱......我想我们只是使用jQuery。

所以我试图做的是这样的：

$(document).ready(function() { 
    if (window.location.href == "http://convio.cancer.ca/site/TR/Events/General?pg=informational&fr_id=21959&type=fr_informational&sid=10335") { 
     //new banner 
     $('#bannerrmv').attr("src", "../images/content/pagebuilder/bikerunning.png"); 
    } else { 
     //original banner 
     $('#bannerrmv').attr("src", "../images/content/pagebuilder/cancer_fighter_sweat_971_x_327103179.jpg") 
    } 
});

但它不工作。如果我要使用.hide()和.show()它确实可以隐藏我拥有的横幅。

这是横幅广告的HTML：我搜索栈

<div class="banner-container" id="bannerrmv"> 
    <img src="../images/content/pagebuilder/cancer_fighter_sweat_971_x_327103179.jpg" class="banner" width="100%" alt="Image Name" /> 
</div>

，我已经遇到了一堆类似的问题，但不同的场景。

我觉得我0123ern是不正确的，但我不知道我会改变它。

如果我想让它成为多个网址，我需要做的就是添加||然后url对不对？

任何建议将超级赞赏！感谢您的时间。

哪里是在HTML部分的'bannerrmv' ID ？你必须在html中定义它，然后在div中使用它的javascript –

。 – Umeed

OH gah它假设是在img标签不应该吗？ – Umeed

答

yup。针对图像：$.('#bannerrmv img').attr("src","../images/content/pagebuilder/bikerunning.png"）

哦哇我不知道我们可以这样做。所以添加一个空间然后元素不会导致问题？ – Umeed

可以将名为bannerrmv的元素内的任何图像作为目标。 – sweaver2112

好吧，这是完美的，因为它也取代了手机视图图像！涂料非常感谢你。这为我节省了很多时间 – Umeed

答

你可以做到这一点，切换路径值，并确定要取代旧的各个URL：

var imageToChange = $('#img')[0]; 

switch(document.location.pathname){ 
    case '/url/first': 
     imageToChange.src = 'first.jpg'; 
     break; 
    case '/url/second': 
     imageToChange.src = 'second.jpg'; 
     break; 
    ... 
}

如何使用jQuery在特定页面上更改图像？

相关推荐