javascript - 使用 javascript 媒体查询更改 2 个 div 的类

Question

<script>
     $(window).resize(function(){
     console.log('resize called');
     var width = $(window).width();
     if(width >= 900){
         $('#lefty').removeClass('alpha');
         $('#righty').removeClass('omega');
     }
     else{
         $('#lefty').addClass('alpha');
         $('#righty').addClass('omega');
     }
   })
   .resize();
</script>

我正在尝试使用此代码向两个 div（左和右）添加/删除 alpha 和 omega 类。

经过一些萤火虫调试后，这段代码甚至都没有被执行，我也不完全确定为什么。

它可能相关，也可能不相关，但此代码应更改的 div 包含在 php 中，如下所示：

<?php
  require ("include_nav.html");
?>

我对 javascript 的了解还不够，无法知道为什么这不起作用！谢谢你的帮助。

Answer 1

您的代码中的功能正在运行：

http://jsfiddle.net/ccjyD/

它可能不会被调用的原因：

• 在加载 jQuery 之前调用它。
• $(window).resize...在导致它不执行事件侦听器之前存在一些语法错误。
• 您的 PHP 文件中存在错误。

---

更新

大多数情况下，如果一个事件监听器只触发一次，那是因为：

$(window).resize(yourFunc());
function yourFunc(e){  //^------shouldn't have ()
    //blah
}

如果您使用匿名函数而不是 this，那么您的代码中肯定存在其他问题。