Question

我有以下HTML：

  <span class="thumbnav" id="?"><?php get_the_image(); ?></span>
  <span class="thumbnav" id="?"><?php get_the_image(); ?></span>

  <div class="?" style="display:none;">
       Some image, and a bit of text are staring at you.
  </div>

  <div class="?" style="display:none;">
       Some image, and a bit of text are staring at you.
  </div>

我的目标是使用jQuery查找每个＆lt; span ＆gt;的ID值，然后使用该ID设置 .click（）事件在＆lt; div ＆gt;上触发a。 show（）功能元素。

到目前为止，我有这个：

var clasid = $(".thumbnav").attr("id");

 $("#" + clasid).click(function () {
 $("." + clasid).show();
});

哪个有效，但仅适用于第一个＆lt; 范围＆gt;。

所以我想知道是否有办法使这个脚本适用于所有跨度，我阅读了jQuery文档，他们建议使用 .map（）或 .each（），但我还没有弄清楚。

如果有人能给我一个关于如何隐藏＆lt; div ＆gt;的提示，那也很棒。当新的＆lt; div ＆gt;时处于有效状态正在显示。

谢谢！

Answer 1

您可以编写类事件并动态访问该元素ID：

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

$("." + this.id).show(); // this.id will give you clicked element id

})

请参阅FIDDLE EXAMPLE

Answer 2

您可以使用以下方法绑定它们：

$(".thumbnav").click(function () {
 $('.'+this.id).show();
});

使用jquery获取多个元素的属性值。然后使用它们

2 个答案: