jquery - 当浏览器以小于 700 像素的宽度加载时删除类

Question

我正在尝试删除一个类，<a> 当有人在小于 700px 的设备上访问网站时，下面的代码在我的浏览器大于 700px 并且我将其调整为低于 700 时有效。但如果浏览器已经低于 700px 像上课剩下的电话。

提前致谢。

$(function(){
        $(window).bind("resize",function(){
            console.log($(this).width())
            if($(this).width() <700){
            $('a').removeClass('element')
            }
            else{
            $('a').addClass('element')
            }
        })
        })

Answer 1

你可以试试：

$(document).ready(function(e) {
    dothis();
});

$(window).resize(function(e) {
    dothis();
});

function dothis(){

    console.log($(window).width());

    if($(window).width() < 700){
        $('a').removeClass('element');
    } else {
        $('a').addClass('element');
    }
}

也运行该dothis()函数，document ready以便它在页面加载时运行。

Answer 2

页面加载时需要手动触发事件

$(function () {
    $(window).resize(function () {
        console.log($(this).width())
        if ($(this).width() < 700) {
            $('a').removeClass('element')
        } else {
            $('a').addClass('element')
        }
    }).resize();//trigger the event manually when the page is loaded
})