假設單擊按鈕時觸發菜單，現在1_要取消它，用戶必須能夠單擊頁面上的任意位置（不僅在同一個按鈕上），2_ 頁面上的所有其他內容在整個過程中仍必須保持可選狀態。這是我嘗試過的：$(".dad").click(function() {  $(".son").show();  $(".mask").show();});$(".mask").click(function() {  $(".son").hide();  $(".mask").hide();});.dad {  background: greenyellow;  width: 20px;  height: 20px;  margin-top: 100px;  z-index: 2;}.son {  position: relative;  left: 20px;  bottom: 100px;  width: 100px;  height: 100px;  display: none;  background: tomato;  z-index: 2;}p {  z-index: 2;}.mask {  position: fixed;  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: 1;  display: none;}<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js "></script><p>This is a paragraph</p><div class="dad">  <div class="son"></div></div><div class="uncle"></div><div class="mask"></div>此代碼滿足第一個條件（單擊頁面上的任何位置時“.son”隱藏），但不滿足第二個條件。因為當“.son”可見時，該段落不是立即可選擇的，除非用戶再次單擊。雖然這似乎是一個小問題，但有時它可能會變得有點煩人，因此這是一個要求。（我也嘗試過其他方式。例如，面具上的 CSS “pointer-events: none”，但它有不同的目的，因為它也取消了點擊事件）。那么怎么可能做到呢？提前致謝。注意：這不僅僅是一個 CSS 問題，如果它們提供更簡單/更好的解決方案，我也會接受任何 Javascript 或 Jquery 答案。