Question

我知道如何使用javascript制作图片库..当我点击图片时它变得更大......好吧如果我有50张图片......我必须为我的画廊写50个功能才能工作!! ... 我的问题是......有没有办法编写一个能节省我时间和费用的短函数？

例如，这是其中一项功能：

function changeImg1(){
  $("#show").hide("explode");
  $("#show").show("bounce");
  $("#captionText").hide("explode");
  $("#captionText").show("pulsate");
  showImage.setAttribute("src",images[1]);
  showCaption.innerHTML=(captions[1]);
  imageIndex=1;
  captionIndex=1;
};

非常感谢，我从你那里学到了很多东西......

Answer 1

你需要在js和jquery中读到“this”。例如

$(".many_many_img_with_same_class").click(function(){

  var current_img_src = $(this).attr( "src" );

  alert(current_img_src);

});

所以点击img，函数在这个img的上下文中运行，并且总是显示点击的img的src。附：在评论中提出问题

HTML

<img src="/some/place1" data-any-spec-text="my text 1" class="many_many_img_with_same_class">
<img src="/some/place124" data-any-spec-text="my text 222" class="many_many_img_with_same_class">
<img src="/some/other/place" data-any-spec-text="more text 222" class="many_many_img_with_same_class">

JS

$(".many_many_img_with_same_class").click(function(){

  var current_img_src = $(this).attr( "src" );
  var current_img_capton_info = $(this).data( "any-spec-text" );

  alert(current_img_src, current_img_capton_info);

});

如何使图库更容易

1 个答案: