Get Bootstrap大小未定义

Question

我正在尝试检测引导程序大小（xs / sm / md / lg）。

我试过这些链接：

• How to detect responsive breakpoints of Twitter Bootstrap 3 using JavaScript?

• jQuery detect Bootstrap 3 state

不幸的是，

我发现的答案有“bug”或类似的东西。

如果您在window resize事件上记录引导程序大小，您会看到有时会记录undefined。

当您将窗口从引导程序大小1调整为引导程序大小2时会发生这种情况。

例如，当您从xs调整为sm。

时

Answer 1

如果你包含this library，你可以运行这样的函数：

<script>
(function($, document, window, viewport){

  // Executes once whole document has been loaded
  $(document).ready(function() {
    console.log('Current breakpoint:', viewport.current());
  });

  $(window).resize(
    viewport.changed(function(){
      console.log('Current breakpoint:', viewport.current());
    })
  );

})(jQuery, document, window, ResponsiveBootstrapToolkit);
</script>

问题似乎是关于将ResponsiveBootstrapToolkit确定为视口范围的文档不够清楚，如上所示。