我的网络项目在div元素中有一个下拉菜单。单击页面上的任何其他主链接（不包括下拉菜单本身的链接）时，调用javascript函数HideDropdown将隐藏菜单。
当我单击主体上除下拉菜单本身之外的任何位置时，我还想调用HideDropdown（）来隐藏菜单（如果它已打开）。我创建了一个javascript click handler函数，但是它没有隐藏菜单（它什么也没有做）。
这是新的javascript单击处理程序（位于body标签的正下方）：
<script>
body.onclick = function(event) {
target = event.target;
if (target != "#dropdown-content-id") {
if (target != "#dropdown-content-id2") {
HideDropdown();
};
};
};
</script>
这是html代码的相关部分：
<div class="C1"><br>
<div class="dropdown">
<button class="button_01" onclick="HideDropdown();ShowDXT(2);ShowDropdown();"> Display Data Segments</button>
</div></div>
<div id="dropdown-content-id">
<div class="C1"><button class="button_dropdown" onclick="ReadData(1)">Data One</button></div>
<div class="C1"><button class="button_dropdown" onclick="ReadData(2)">Data Two</button></div>
<div class="C1"><button class="button_dropdown" onclick="ReadData(3)">Data Three</button></div>
</div>
这是HideDropdown函数：
<script>
function HideDropdown() {
$("#dropdown-content-id2").hide();
$("#dropdown-content-id").hide();}
</script>
我知道单击主体将隐藏菜单，但是我需要指定仅当目标不是下拉菜单本身时才会隐藏菜单。
非常感谢您的任何想法。
编辑100818：
经过一些工作之后，我将问题归结为：我可以从body标签调用HideDropdown（）函数，如下所示：
<body onload="ShowAjax(1)" onclick="HideDropdown()">
这样可行。但是，当我将其更改为具有限定条件的相同功能时（如果单击事件是由下拉菜单触发的，则不是），开发控制台将显示“ TypeError：e undefined”，因此它与条件语句有关：
<body onload="ShowAjax(1)" onclick="HideDropdown_B()">
<script>
function HideDropdown_B(e) {
if(e.target.id != "dropdown-content-id" ){
$("#dropdown-content-id2").hide();
$("#dropdown-content-id").hide();}
}
</script>
因此，我的问题现在归结为找出当没有if语句的同一个程序正常工作时，上述新函数为何返回类型错误的原因。
最佳答案
<script>
var HideDropdown = function(e) {
if(e.target.id != "dropdown-content-id" ){
$("#dropdown-content-id2").hide();
$("#dropdown-content-id").hide();
}
}
$(document).ready(
function(){
$('body').click(function(event) {
target = event.target;
if (target != "#dropdown-content-id") {
if (target != "#dropdown-content-id2") {
HideDropdown(event);
};
};
});
});
</script>
我已经重写了脚本内容，您需要确保将事件传递给HideDropdown，否则它将无法访问它。