Question

我在下面有这个片段，我正在尝试将其设为if / else语句并且我遇到了语法错误......

<!--script for changing Number of Columns-->
$(window).load(function(){
var idx = $('select[name="numNames"]').children('option:selected').index();
if (idx < 7){
$('.oneColumn').click(function() {
$('.IH_pINameRow').removeClass("floatLeft ");
$('.IH_pINameRow').addClass("floatNone ");
$('.odd').removeClass("leftMargin");
$('.even').removeClass("rightMargin ");
$('.pI_nameText').removeClass("textAlignLeft textAlignRight");  
$('.pI_nameText').css('font-size', '2em');
$('.pI_nameText').addClass("1col");
$('.pI_nameText').removeClass("2col");
$('label.twoColumn').css('background-position', '-104px -52px');
$('label.oneColumn').css('background-position', '-104px -26px');
} else {
    return false;
}
}); //error is here//
if (idx > 3){
$('.twoColumn').click(function() {
$('.IH_pINameRow').removeClass("floatNone ");
$('.IH_pINameRow').addClass("floatLeft ");
$('.odd').addClass("leftMargin");
$('.even').addClass("rightMargin ");
$('.pI_nameText').css('font-size', '1em');
$('.pI_nameText').removeClass("1col");
$('.pI_nameText').addClass("2col");
$('.odd').removeClass("textAlignLeft");
$('.even').removeClass("textAlignRight");
$('.even, .odd').addClass("textAlignCenter");
$('label.twoColumn').css('background-position', '-104px -26px');
$('label.oneColumn').css('background-position', '-104px -52px');
$('label.leftAlignment').css('background-position', '-104px -52px');
$('label.centerAlignment').css('background-position', '-104px -26px');
} else {
    return false;
}
});
});

我也不确定代码范围是否正确，以便idx变量可用于第二个函数...

Answer 1

让我们将其分解为裸露部分，并修复缩进。然后使用一些静态分析来压缩if语句。

<!--script for changing Number of Columns-->
$(window).load(function(){

  function oneColumnClick() {
    $('.IH_pINameRow').removeClass("floatLeft ");
    $('.IH_pINameRow').addClass("floatNone ");
    $('.odd').removeClass("leftMargin");
    $('.even').removeClass("rightMargin ");
    $('.pI_nameText').removeClass("textAlignLeft textAlignRight");  
    $('.pI_nameText').css('font-size', '2em');
    $('.pI_nameText').addClass("1col");
    $('.pI_nameText').removeClass("2col");
    $('label.twoColumn').css('background-position', '-104px -52px');
    $('label.oneColumn').css('background-position', '-104px -26px');
  }

  function twoColumnClick() {
    $('.IH_pINameRow').removeClass("floatNone ");
    $('.IH_pINameRow').addClass("floatLeft ");
    $('.odd').addClass("leftMargin");
    $('.even').addClass("rightMargin ");
    $('.pI_nameText').css('font-size', '1em');
    $('.pI_nameText').removeClass("1col");
    $('.pI_nameText').addClass("2col");
    $('.odd').removeClass("textAlignLeft");
    $('.even').removeClass("textAlignRight");
    $('.even, .odd').addClass("textAlignCenter");
    $('label.twoColumn').css('background-position', '-104px -26px');
    $('label.oneColumn').css('background-position', '-104px -52px');
    $('label.leftAlignment').css('background-position', '-104px -52px');
    $('label.centerAlignment').css('background-position', '-104px -26px');
  }

  var idx = $('select[name="numNames"]').children('option:selected').index();
  if (idx < 7){
    $('.oneColumn').click(oneColumnClick);
    if (idx > 3){
      $('.twoColumn').click(twoColumnClick);
    }
  }
});

Answer 2

首先：请缩进代码，否则很难找到任何错误。

错误在哪里？

您必须先关闭$('.twoColumn').click(function() { if (idx > 3){，否则请在点击功能之前关闭。

你为什么犯这个错误？

正确缩进代码时，不会出现这些错误。我很善良，为你做了这件事：http://jsfiddle.net/7snmR/＆lt;看起来很奇怪，对吧？

将此jquery转换为if / else语句

2 个答案:

错误在哪里？

你为什么犯这个错误？