单击按钮后如何使模态消失？

Question

我需要在模态框的左上角添加一个退出按钮，我也希望模态框在链接复制后消失。我该怎么做呢？

            <div>
            <svg xmlns="http://www.w3.org/2000/svg" class="h-10 w-100" viewBox="21 21" fill="currentColor">
              <path fill-rule="evenodd" d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5zm-5 5a2 2 0 012.828 0 1 1 0 101.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5a2 2 0 11-2.828-2.828l3-3z" clip-rule="evenodd" />
              <text x='35' y='18' style='fill:#444444' class='text-2xl'>Share Link</text>
            </svg>      
            <br />      
            <div style="display: flex; flex-direction: row; justify-content: space-between;">
              <h1 class="text-left" id='text' style='user-select: all'><%= @vacancy.slug %>
                <h2 class="text-right" id='text' style='user-select: all'>        
                  <button onclick= "Copy(document.querySelector('#text').innerText)('#closemodal').click(function() {$('#modalwindow').modal('hide');});">
                    <svg class="align:right w-30 h-9" fill="none" stroke="currentColor" viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg">
                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7v8a2 2 0 002 2h6M8 7V5a2 2 0 012-2h4.586a1 1 0 01.707.293l4.414 4.414a1 1 0 01.293.707V15a2 2 0 01-2 2h-2M8 7H6a2 2 0 00-2 2v10a2 2 0 002 2h8a2 2 0 002-2v-2"></path>
                    </svg>
                  </button> 
                </h2>
              </h1>
            </div>
          </div>
          <div class="text-center md:text-right mt-4 md:flex md:justify-end"></div>
          <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
          <script type='text/javascript'>
          function Copy(text) {
            var elem = document.createElement('textarea');
            elem.value = text;
            document.body.appendChild(elem);
            elem.select();
            document.execCommand('copy');
            document.body.removeChild(elem);
            Swal.fire({
              position: 'center',
              icon: 'success',
              showConfirmButton: false,
              timer: 600
            })
          }
          </script>
      </div>

Answer 1

我查看了您正在使用的库 SweetAlert2 的站点，这就是我发现的... 要添加关闭按钮，请将showCloseButton: true 添加到传递给Swal.fire() 的对象中

https://sweetalert2.github.io/#configuration

关闭模态调用Swal.close()

https://sweetalert2.github.io/#methods