javascript - 当我单击图像时隐藏 div 并打开另一个 div

Question

我有一个图像库，在每个图像中都有一个带有图像名称的 div。当我单击图像时，会打开一个包含一些详细信息的模态，并且具有图像名称的 div 会通过使用工具的 div 进行更改。

我想要的是，当关闭模态时(只需在其外部单击)，一切都会返回到原始阶段，即带有名称的 div 会替换带有工具的 div。

Javascript

$(document).ready(function() {
  var toolbar = $('.ImageButtonsG').html();
  $(".d-block").each(function (index, value) {
    $(this).on("click", function(){
      var default_title = $(this).find('.ImageText');
      $(default_title).html(toolbar);
      $('.ImageButtonsG').empty();
    });
  });
});

Answer 1

我发现你的 JS 代码有问题。这是更新后的代码:

$(document).ready(function() {
  var toolbar = $('.ImageButtonsG').html();
  $(".d-block").on("click", function(){
      var default_title_ele = $(this).find('.ImageText');
      var default_title = $(default_title_ele).html();
      $(default_title_ele).html(toolbar);
      $("#myModal2").on('hidden.bs.modal', function () {
          $(default_title_ele).html(default_title);
      });
    });
});

此处已更新 codepen 。我希望它能解决您的问题。