javascript - 如何在ajax中使用动态添加的html类

标签 javascript jquery html ajax

我正在尝试从页面上的文件夹中提取所有图像。然后我针对 ajax 中的 jquery 元素将 html 类添加到 '.append' 函数。现在我想在另一个函数中使用 ajax 之外的类。但似乎这个类是本地的，因此没有在 ajax 之外定义。你能告诉我如何解决这个问题吗？我的代码-

/* html code */
<body>
  <div id="imageWrapper">

      <div id="spanImage"></div>

   </div>

<script>
var folder = "images/";
  $.ajax({
      url : folder,
      success: function (data) {
          $(data).find("a").attr("href", function (i, val) {
              if( val.match(/\.(jpe?g|png|gif)$/) ) {
                  $("#spanImage").append( "<img src='"+ folder + val +"' class='imageThumbnails'>");
              }
          });
      }
  });

/* I have added class = 'imageThumbnails' dynamically to each image appended. Now I would like to use the class to work on individual image to make them pop up
*/
$(".imageThumbnails").click(function() {...}

</script>
</body>

这不起作用，因为“imageThumbnails”未被系统识别为有效类。你能帮忙吗？

最佳答案

你可以使用下面的代码来绑定(bind)事件

$(document).on("click",".imageThumbnails",function() {...});

这个调用动态绑定(bind)。

关于javascript - 如何在ajax中使用动态添加的html类，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40435370/