javascript - Jquery按钮多次替换图像

Question

标题可能措辞不当，所以我在这里解释一下我的意思。

我有三个按钮，我想根据它们按下的内容来替换 div 的图像。例如，第一张图片是一片森林。一个按钮对应于进一步进入的选择，以便该按钮用另一个图像替换该图像。一个按钮会让你拿起东西/去另一个地方，后一个选项用另一个替换当前图像，最后一个会让你头痒。

用按钮替换图像一次没什么大不了的，但是如果您希望按钮在按下按钮后用新图像替换图像，我不明白您应该怎么做？

Answer 1

只需更改 css background-image : url 就像我在下面所做的那样。当您单击带有 id (id #grass) 的按钮时，它基本上会更改页面中心部分的背景图像(例如 grass.jpg 的 url)。 我将图像名称和 Id 设为相同只是为了使其更易于理解。 希望能帮助到你。

$('#grass').click(function(){
  $('.central').css('background-image', 'url("img/grass.jpg")');
});
$('#flower').click(function(){
  $('.central').css('background-image', 'url("img/flower.jpg")');
});
$('#forest').click(function(){
  $('.central').css('background-image', 'url("img/forest.jpg")');
});