Question

我试图更改我的超链接指向浏览器调整大小的位置，但是我要么阻止所有链接，要么都不阻止

var $w = window.innerWidth || document.documentElement.clientWidth;

if ($w > 1025) {
    $('a.something').each(function (e) {
        e.preventDefault();
        location.href = "/products.html";
    });
} else {
    $('a.something').each(function (e) {
        e.preventDefault();
         location.href = "javascript:void(0);";
    });
}

if ($w > 1025) {
    $('.mainMenu > li').unbind().hover(function () {
        $(this).find('.subMenu').stop().slideToggle(400);
    });
} else {
    $('.mainMenu > li').unbind().click(function (e) {
        $(this).find('.subMenu').stop().slideToggle(400);
    });
}

Answer 1

每次调整大小时进行多次DOM更改可能会非常昂贵并且会降低网站速度。我建议让功能根据浏览器大小确定要采取的操作。

$(document).on('click', 'a[href]', function (e) {
    var width = window.innerWidth || document.documentElement.clientWidth;

    if (width < 1025) {
       e.preventDefault();
    }
});

这只会在视图尺寸较小（低于1025像素）的情况下阻止链接。

$('.mainMenu > li').on('hover click', function () {
    $(this).find('.subMenu').stop().slideToggle(400);
});

您可以同时进行两种绑定。如果你真的需要，你可以在这个区块中使用相同的内容，但我认为在大多数情况下你都可以保持原样。

在浏览器调整大小时更改超链接位置

1 个答案: