Question

我想要一个窗口中有多个图像。当我单击图像时，我想切换出显示一些信息。我希望在所有图像上都这样。

Answer 1

您没有发布正在使用的技术，因此我假设您正在使用jQuery和html：

这是html示例：

<div>
  <img class="img" data-imgid="img1" src="https://i2.wp.com/beebom.com/wp-content/uploads/2016/01/Reverse-Image-Search-Engines-Apps-And-Its-Uses-2016.jpg?w=640&ssl=1" width="200px" />
  <br/>
  <text style="display:none;" id="img1">Image1 ......</text>
  <br/><br/>
  <img class="img" data-imgid="img2" src="http://www.111ideas.com/wp-content/uploads/2018/01/download-rose-image.jpg" width="200px" />
  <br/>
  <text style="display:none" id="img2" class="text" hide>Image2 </text>
  <br/><br/>
  <img class="img" data-imgid="img3" src="https://processing.org/tutorials/pixels/imgs/tint1.jpg" width="200px" />
  <br/>
  <text style="display:none" id="img3" class="text" hide>Finally Image3 :)</text>
</div>

这是处理切换过程的jQuery代码。您需要使用基于onclick函数内html代码中任何文本标签的id的toggle方法进行切换：

$(function () {
            $('.img').on('click', function () {
                var txtId = $(this).attr('data-imgid');
                $('#' + txtId).toggle();
            });                   
    });

您可以在此处观看现场演示： http://jsfiddle.net/gtU56/342/

请告诉我如何创建图像切换？

1 个答案: