您可以使用以下代码：

function openCardsList() {
    let window = document.getElementById("anchor-cards-list");
    window.style.display = "block";
  }
  function hideDiv(){
    let window = document.getElementById("anchor-cards-list");
    window.style.display = "none";
  }

并将onclick事件添加到父div

div onclick="hideDiv()" style="height: 100vh;">
  <div class="collapse" id="anchor-cards-list">Lorem Ipsum</div>
</div>

我个人会把事情简单化，把关注点分开，在按钮上添加一个事件监听器（click）来显示你的div，在div上添加一个事件监听器（blur）来隐藏它。

document.getElementById('anchor-open-cards-list-btn').addEventListener('click', showDiv);
document.getElementById('anchor-cards-list').addEventListener('blur', hideDiv);

然后showDiv和hideDiv只处理元素的可见性。

简单使用jquery

使用toggle（）代替show/hide，因为它更清晰和简单。

$(document).ready(function(){
  $("#anchor-open-cards-list-btn").click(function(){
   $("#anchor-cards-list").toggle();
 });
});

或

function openCardsList() {
  $("#anchor-cards-list").toggle();
}

或
对于onblue，也可以使用以下代码

function openCardsList() {
 $("#anchor-cards-list").css('display','block');
}
function hideD(){
 $("#anchor-cards-list").css('display','none');
}

在父div中添加onclick事件

div onclick="hideD()">
 <div id="anchor-cards-list">text</div>
</div>

我更喜欢在函数之外制作let窗口，这样你就可以在任何需要的时候使用它。而且如果你只在onclick和onblur时为handle show/hide div制作这个窗口，你就不需要jquery。默认的javascript可以提供这些事件操作。
script.js

let card = document.getElementById('anchor-cards-list')

function openCard() {
  card.style.display = 'block'
}

function blurCard() { 
 card.style.display = 'none'
}

index.html

<div id="anchor-cards-list">Hello Text</div>
<button onclick="openCard()" onblur="blurCard()">Clik me</button>

const phoneCross=文档.getElementById（“电话交叉”）.addEventListener（“单击”，函数（）{

console.log('clicked phone cross button');
            // cross button display none successful way
            document.getElementById('main-phone-div').style.display='none';