android - 防止CSS/jQuery弹出窗口允许点击其下方的链接(仅限移动设备)

原文 标签 android jquery html css mobile

所以我创建了一个使用css和jquery的简单弹出窗口。问题是,当弹出窗口被激活时,仍然可以单击弹出窗口下方的链接。有什么办法可以防止这种情况的发生。弹出窗口中某些链接的单击框很小,可以轻松单击它旁边的链接,这意味着单击了弹出窗口下方的链接。

我正在工作的网站:taxslayerplayer.com,在android上查看它,您会明白我的意思。另外,在手机上浏览时,我在许多其他网站上也遇到了此问题。

任何指针将不胜感激,谢谢!

最佳答案

我不确定严格的移动解决方案,但是您可以检查弹出窗口是否可见,如果可见,只需单击链接的单击处理程序中的return false即可:

$('a').filter(
    function(){
        return !$(this).closest(popupSelector).length;
}).on('click', function(e){
    if ($(popupSelector).is(':visible')) {
        return false;
    }
    else {
        // do whatever you'd normally do with the links
    }
});


或者,您可以改用变量,例如popupIsShown,最初(在DOMReady上)将其设置为false,然后在显示弹出窗口时将其设置为true,并在重新显示时重置为false -hidden,使<​​cc>检查便宜一些:

$('a').filter(
    function(){
        return !$(this).closest(popupSelector).length;
}).on('click', function(e){
    if (popupIsShown) {
        return false;
    }
    else {
        // do whatever you'd normally do with the links
    }
});

关于android - 防止CSS/jQuery弹出窗口允许点击其下方的链接(仅限移动设备),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11852821/

相关文章:

c# - APK包不在ASP.NET Core MVC中提供

android - 如何在Android中实现Squats计数器?

javascript - 我在表字段中有文本,我想使用悬停和Java脚本中的if条件来包装文本

php - 通过ajax分割输出值,

javascript - AAPT : No resource found that matches the given name: attr 'android:keyboardNavigationCluster'

android - 更改 RecyclerView 中项目 UI 的最有效方法是什么?

jquery - CSS/图像翻转/jQuery?

javascript - bootstrap-datepicker在选择日期时不会更新AngularJS模型

html - 可以将背景图像设置为图像吗?

html - 图像在鼠标悬停时移动