Question

我正在尝试在窗口调整大小时运行此代码，这是我的代码：

    $(document).ready(function () {
            updateContainer();
            $(window).resize(function() {
                updateContainer();
            });

            $('#slider').lightSlider({
                item:1,
                slideMove:1,
                slideMargin: 30,
                loop: true,
                autoWidth: slideWidth
            });
        });
        function updateContainer() {
            var $winWidth = $(window).width();
            if ($winWidth > 1100) {

                var slideWidth = false;

                /* Toggle navigation
                ======================================================================== */
                $('.menu, .search, .categories').click(function(e) {
                    $(this).toggleClass('active');
                    e.preventDefault();
                });


                /* Back To Top
                ======================================================================== */
                $('#back-top').click(function(e) {
                    e.preventDefault();
                    $('html, body').animate({
                        scrollTop: 0
                    }, 500);
                });

            }

            if ($winWidth > 700) {
                var slideWidth = true;
            }
        }

控制台中出现一个错误：var slideWidth未定义。

我做错了什么？我已经尝试了几种写这种方法，但没有一种方法有效......

Answer 1

在document准备就绪期间，您尚未在此处进行定义：

$('#slider').lightSlider({
    item:1,
    slideMove:1,
    slideMargin: 30,
    loop: true,
    autoWidth: slideWidth
});

在上述阶段，没有定义。使其在更高的范围内可访问：

$(document).ready(function () {
  var slideWidth = false;
  updateContainer();
  $(window).resize(function() {
    updateContainer();
  });

  $('#slider').lightSlider({
    item:1,
    slideMove:1,
    slideMargin: 30,
    loop: true,
    autoWidth: slideWidth
  });
});

使用var slideWidth = false;使其进入全局范围。当你执行updateContainer()时，它将更新全局变量。

并确保在您的updateContainer()中使用var ：

function updateContainer() {
    var $winWidth = $(window).width();
    if ($winWidth > 1100) {
        slideWidth = false;
    // Other code
}

Answer 2

您的slideWidth变量是在无法访问的范围内定义的，在您准备好的处理程序之后定义并初始化为false：

$(document).ready(function () {
    var slideWidth = false;

然后删除var：

if ($winWidth > 700) {
   slideWidth = true;

}

在窗口调整大小时运行代码

2 个答案: