jQuery if語句破壞了我的代碼

Question

這是我的代碼：

$("#header").touchwipe({
//  if($('#cont-wide').css('left') == '-100%' ){
         wipeLeft: function() { 

                $('#cont-wide').animate({
                        left: '-201%'
                }, 500 );
                $('#nav-filters').fadeOut(200);
                $('#nav-map-l').delay(300).fadeIn(200);

                $('#one .col-inner').delay(500).hide(0);

                $('#three .col-inner').css('display','block');

                setTimeout(function() { 
                window.scrollTo(0, 1) }, 
                100);
            },
         wipeRight: function() { 

                $('#cont-wide').animate({
                        left: '1%'
                }, 500 );
                $('#nav-filters').fadeOut(200);
                $('#nav-map-r').delay(300).fadeIn(200);

                $('#one .col-inner').css('display','block');

                setTimeout(function() { 
                window.scrollTo(0, 1) }, 
                100);

            },
         min_move_x: 50,
         min_move_y: 50,
         preventDefaultEvents: false
//  }   
});

就目前而言，它工作正常。 但是，當我刪除注釋以添加條件語句時，該代碼和所有其他JavaScript停止運行。 謝謝

Answer 1

您不能在其中放置if語句...

你可以這樣做：

 wipeLeft: function() { 
      if($('#cont-wide').css('left') == '-100%' ){
         // the rest
      }
 },
 wipeRight: function() { 
      if($('#cont-wide').css('left') == '-100%' ){
         // the rest
      }
 }

注- css功能我不會產生你期待的結果： http://jsfiddle.net/VccAn/使用的價值10%的left在我的例子返回auto在Chrome！ 有關此問題的討論，請參見此問題/答案： jQuery .css（“ left”）返回“ auto”而不是Chrome中的實際值

Answer 2

您不能只在語句中間插入if語句。

最好的解決方案是在調用touchwipe()之前創建您的options對象：

var options = {};
if($('#cont-wide').css('left') == '-100%') {
    options.wipeLeft = function() {

    };

    options.wipeRight = function() {

    };
}

$("#header").touchwipe(options);

請注意， if條件僅被評估一次。 如果您希望在每個事件中對它進行評估，則@ManseUK的答案是正確的方法。