javascript - 移动版网站点击隐藏

Question

我的一些 JavaScript 有问题:对于网站的计算机版本，当我将鼠标悬停在按钮上时，会出现一些文本，而当我单击网站上的其他任何地方时，文本会隐藏。

我不知道如何为同一网站的移动版本构建一个页面，当我点击一个按钮时，文本会出现，当我点击其他任何地方时，我想隐藏文本。 我试过:

if(jQuery.browser.mobile)  {
    $(".button").on("click", function()  {
        $(".text").show();
    });
    //this section doesn't work
    $("body").on("click", function()  {
        $(".text").hide();
    });
}
else  {
    //desktop code here, irrelevant
}

Answer 1

您的代码中存在冲突，因为 class 是 body 的一部分。因此，当您单击 class 时，这两个事件都会被调用。

这篇文章中的信息将帮助您解决问题:
How do I detect a click outside an element?

通过在您的 class 事件中使用 event.stopPropagation();，您应该能够区分这两个事件。
请注意，如果您的类元素或它包含的任何元素处理其他事件，此解决方案可能会引发其他问题。在这种情况下，您可能想尝试我引用的帖子中的其他解决方案。

我认为您在移动版本上的工作与此无关。