javascript - 以设定的窗口宽度调用JS函数

我想调用一个JavaScript函数，该函数在每次加载窗口以及每次调整屏幕大小时都会检查窗口的宽度。原因是我不希望屏幕尺寸太小时使用某个功能，例如移动尺寸。

能做到吗？

香港专业教育学院试图做这样的事情

window.onload = function () {
    if (window.onload.innerWidth > 991 || window.onresize.innerWidth > 991) {
        var maxHeight = 0;
        setTimeout(function () {
            maxHeight = 0;
            $(".menu> div").each(function () {
                var thisHeight = parseInt($(this).css("height").toString().replace("px", ""));
                if (thisHeight > maxHeight) {
                    maxHeight = thisHeight;
                }
            });
            $(".menu> div").css("height", maxHeight.toString() + "px");
            $(".menu").sortable({
                handle: "h3",
                placeholder: {
                    element: function (currentItem) {
                        return $("<div class='col-md-4 placeholderBlock' style='height:" + (maxHeight).toString() + "px; '></div>")[0];
                    },
                    update: function (container, p) {
                        return;
                    }
                }
            });
            $(".menu").disableSelection();

            $(".widget").each(function () {
                $(this).click(function () {
                    enableDisableWidget($(this));
                });
            });

            setInterval(function () {
                var menu= { items: [] };
                $(".menu> div").each(function () {
                    menu.items.push(
                        {
                            classes: "." + $(this).attr("class").replace(/\ /g, ' ')
                        }
                    );
                });
                $(".hiddenField_dashboardLayout").val(JSON.stringify(dashboardItems));
            }, 500);
        }, 2000);
    }
}

最佳答案

window.onload.innerWidth > 991 || window.onresize.innerWidth

那是行不通的。这两个事件属性都没有名为innerWidth的属性。

您需要将其更改为：

document.body.offsetWidth，window.innerWidth或document.documentElement.clientWidth

onload将完成您希望在页面上加载的内容。

添加另一个名为onresize的事件

$(window).on("resize", function(){});

您还可以为此使用CSS：

@media only screen and (min-width: 991px) { ... }

大括号之间的css规则仅在屏幕大于991像素时适用。