jquery - jQuery多个if else语句卡在第二个条件

Question

有人请告诉我为什么下面的脚本只适用于第一个“else if”语句？

即使宽度低于 800 像素，我仍然可以获得 900 像素的设置。

这是实时代码http://jsbin.com/iranof/2/

<script type='text/javascript'>
$(document).ready(function(){ 

var window_width = $(window).width();  

if (window_width >= 900){
$('#adSize').attr('id','largeRectangle');    
}
else 
  if (window_width <= 800)  
  {
$('#adSize').attr('id','mediumRectangle');
}  
else 
  if (window_width <= 700)  
  {
$('#adSize').attr('id','square');
}  
else
  if (window_width <= 600)  
  {
$('#adSize').attr('id','smallSquare');
}  
else if (window_width <= 480)
{
$('#adSize').attr('id','mediumRectangle');
} 
});
</script>

Answer 1

700 <= 800。如果 window_width 小于 800，则第一个else if检查将返回true- 因此将调用其主体；所有其他else if将被忽略。

重建您的代码，以便<=检查处理越来越多的数字：

else if (window_width <= 480) { ... }
else if (window_width <= 600) { ... }
else if (window_width <= 700) { ... }
else if (window_width <= 800) { ... }

Answer 2

它需要是：

if (window_width >= 900){   
}
else 
  if (window_width <= 800 && window_width > 700)  
  {
}  
else 
  if (window_width <= 700 && window_width > 600)  
  {
} 

以此类推……否则，else if一旦您进入800分店，您的其他分店将被放弃。

Answer 3

if (window_width >= 900)
{   
$('#adSize').attr('id','largeRectangle');
}
else 
if (window_width <= 800 && window_width > 700)  
{
$('#adSize').attr('id','mediumRectangle');
}  

...

Answer 4

试试这个...

<script type='text/javascript'>
$(document).ready(function(){ 

var window_width = $(window).width();  

if (window_width >= 900){
$('#adSize').attr('id','largeRectangle');    
}
else 
  if (window_width >= 800)  
  {
$('#adSize').attr('id','mediumRectangle');
}  
else 
  if (window_width >= 700)  
  {
$('#adSize').attr('id','square');
}  
else
  if (window_width >= 600)  
  {
$('#adSize').attr('id','smallSquare');
}  
else if (window_width <= 600)
{
  $('#adSize').attr('id','mediumRectangle');
} 
});
</script>