jquery - 单击其他位置时切换关闭

Question

我有一个 ul，其中包含我不想轻易访问的重要操作。ul 被 jquery 隐藏，然后当单击链接时，它会切换显示选项。我希望用户能够单击选项，但如果他/她在 ul 仍处于切换状态时单击页面上的其他位置，则它会再次切换并隐藏

<a href="#" id="property-option-handle">Options</a>

<ul id="property-options">
    <li><a href="#">Delete Property</a></li>
    <li><a href="#">Archive Property</a></li>
</ul>

$('#property-options').hide();
$("#property-option-handle").click(function() {
    $('#property-options').slideToggle("slow");
});

这是我的 jsFiddle http://jsfiddle.net/TEBeM/

Answer 1

$('#property-options').hide();
    $("#property-option-handle").click(function(evt) {
    $('#property-options').slideToggle("slow");
    evt.stopPropagation();
});

$("#property-options").click(function(evt) {
    evt.stopPropagation();
});

$(document).click(function(evt){
    $('#property-options').slideUp("slow");
    evt.stopPropagation();
});

试试这个..它肯定会奏效。