我有一个 share 链接，单击它会显示链接列表。我正在使用 toggle 来隐藏和显示此列表。
当列表可见时，用户可以单击共享来隐藏(切换)链接列表的可见性。
但是，这样做的一个小问题是，在用户通过按 share 切换列表之前，链接列表一直可见。
我添加此脚本是为了在用户单击列表外部时关闭列表。
$(".meta-share").click(function() {
event.preventDefault();
$(".social-share").fadeToggle();
});
$(document).mouseup(function(e) {
var container = $(".social-share");
if (!container.is(e.target) && container.has(e.target).length === 0) {
container.fadeOut();
}
});
但是，切换 现在无法按预期工作。
有人能帮忙吗？
这是一个 jsFiddle显示问题。
最佳答案
那是因为你说当你点击目标和目标旁边时会淡出。当目标是 meta 时，您所要做的就是返回 false——在您的 document.mouseup 中共享。
$(".meta--share").click(function() {
event.preventDefault();
$(this.nextElementSibling).fadeToggle();
});
$(document).mouseup(function(e) {
if(e.target.className == "meta--share"){
return false;
}
var container = $(".social-share");
if (!container.is(e.target) && container.has(e.target).length === 0) {
container.fadeOut();
}
});
这是您调整后的 fiddle :https://jsfiddle.net/9hpw15oq/2/
更新
在 .click 函数中。而不是通过类查找元素。使用 .click 事件选择元素。
我已经更新了代码和 fiddle
关于javascript - 单击外部时隐藏列表，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50621208/