Question

我有一个div，当有人点击同一页面上的缩略图时，它会从其他页面加载信息。

目前，当某人点击缩略图时，页面顶部的div #dynamic将加载并显示来自其他页面的信息。我希望能够允许用户点击一个关闭按钮，我已经给了一个类button_close，让他们关闭div而不是点击其中的任何地方。该按钮也在#dynamic div中显示。

$(document).ready(function(){
   $('nav.main > a').click(function(e){
    e.preventDefault();
    $("#dynamic").load($(this).attr('href') + " .product_content", ()=>{ window.scrollTo(0, 0) }).fadeIn('slow');
   });
      $(".button_close").click(function(){
          $(".product_container").html ('');
      });
  });

Answer 1

由于您的close_button是动态生成的，因此您可以使用以下

$('body').on('click', '.button_close', function(){
    $('#dynamic').html('');
});

一个简单的例子

<!DOCTYPE html>
<html>
<body>

<script src="http://code.jquery.com/jquery-latest.js"></script>

<script>
function loadDiv() {
    $('#dynamic').html('<p>Some content loaded from another page</p><div class="button_close">Close Me</div>');
}

$('body').on('click', '.button_close', function(){
    $('#dynamic').html('');
});
</script>

<div id="dynamic"></div><br><br>
<button onclick="loadDiv()">Load Div</button>

</body>
</html>

单击div内的按钮时关闭div

1 个答案: