Question

用html js css实现点击第二张图片取消第一张效果

例如说，有6张图片，点击图片1，图片1会变成图片2 点3会变4 问题是在点1变成2之后 点击3，那么2会变回1，在点3变4后，点击5，那么4变回3，请教如何做到，类似于用图片实现单选

Answer 1

方法有很多，看你想html代码少点，还是js代码少点。我写了一个，不是最好的，不过可以用。

<div class="box">
  <ul>
    <li class="on"><img src="1.jpg" /></li>
    <li class="hide"><img src="2.jpg" /></li>
  </ul>
</div>
<div class="box">
  <ul>
    <li class="on"><img src="3.jpg" /></li>
    <li class="hide"><img src="4.jpg" /></li>
  </ul>
</div>
<div class="box">
  <ul>
    <li class="on"><img src="5.jpg" /></li>
    <li class="hide"><img src="6.jpg" /></li>
  </ul>
</div>

css 代码

.hide{display:none;}

js代码 引用jquery

$(function(){
  $('.box .on').click(){
    $('.box .on').show();
    $('.box .hide').hide();
    $(this).find('.on').hide();
    $(this).find('.hide').show();
  }
});

Answer 2

轮播，在网上可以搜到，跟点击类似

Answer 3

直接用js修改图片行不...

$("XXX").css("background-image","url(xxxxx.jpg)");