javascript - jQuery:当窗口宽度匹配数组中的任何值时触发函数

Question

我在一个响应式网站上工作，有几个特定的​​功能需要在窗口调整大小时的某些点触发:当窗口达到定义的“移动宽度”时，当它达到定义的“桌面”宽度时，以及当它达到指定数字数组中的任意宽度(我的 CSS 断点)。

这是一个精简的 fiddle ，显示我所在的位置(所有附加的段落元素都是我的函数将去向的占位符):http://jsfiddle.net/ygwug/

正如您通过调整窗口大小看到的那样，我已经让移动/桌面检查正常工作，但断点检查器不工作。具体与此相关的代码如下:

var breakpoints = [320, 480, 550, 650, 720, 790, 1000, 1190];
    window_w = $wind.width();

var breakpointHit = function() {
    $('body').append("<p>Breakpoint was hit!</p>");
}

if ( $.inArray( window_w, breakpoints ) > -1 ) {
    breakpointHit();
}

据我了解，如果数组中不存在该值，则 $.inArray 应返回 -1，如果存在，则应返回该值的索引，这就是为什么我使用“> -1”来确定是否值存在于数组中。但是由于我在 Dev Tools 中没有看到任何语法错误，所以我的逻辑中一定有错误。

如果有人能帮我指明正确的方向，我将不胜感激。谢谢!

Answer 1

检查原始 jFiddle 的修改:http://jsfiddle.net/hKRrm/1/

我改变了什么:

• 将您的断点测试移至窗口调整大小
• 允许breakpointHit接受命中的断点
• 修改断点测试，使其为window_w < breakpoint最有可能的预期(== 永远不会带你去任何地方)
• 加入当前断点缓存，防止断点多次触发
• 移动了 mobileCheck拨入breakpointHit功能应该在的地方。我的意思是，您只想检查是否遇到断点时您是否在移动设备上，而不是一直检查。

这可能会也可能不会回答您的问题，但这是我将您的问题解释为要求的内容。