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

Question

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

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

以下是实时代码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＆lt; = 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)  
  {
} 

等等......否则，一旦进入800分支，其他else if分支将被放弃。

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>