JavaScriptコードを使用したif条件で関数メソッドを使用するにはどうすればよいですか？

Question

JavaScriptコードにconditionメソッドを渡したいと思います。このコードはInternet Explorer 10のバージョンでは機能しません。

機能宣言をブロックに配置しないでください。関数式を使用するか、ステートメントを外部関数の先頭に移動します。

私はここでどのような機能を持つことができますか？

  if(jQuery("header").attr("id") == "header-style-two") 
     { 
        function sticky_relocate() { 
         var window_top = jQuery(window).scrollTop(); 
         var div_top = jQuery('#sticky-anchor').offset().top; 
         if (window_top > div_top) { 
          jQuery('.mainmenu-area').removeClass('light-menu'); 
          //This is for when div in top   
         } else { 
          jQuery('.mainmenu-area').addClass('light-menu'); 
          //This is for when div in not top 
         } 
        } 

        jQuery(function() { 
         jQuery(window).scroll(sticky_relocate); 
         sticky_relocate(); 
        }); 
     } 

Answer 1

You can't have named function in an if block（それは仕様と巻上で有効ではありませんとにかく、それはむしろ混乱になるだろうが、いくつかのJavaScriptエンジンが、それは一部のブラウザでは動作も理由である、不正なコードを補正しようとする場合があります）がありますが、 ifブロック内の変数に関数を割り当てることができます。

むしろより：

if(jQuery("header").attr("id") == "header-style-two") 
{ 
    var sticky_relocate = function() { 
     var window_top = jQuery(window).scrollTop(); 
     var div_top = jQuery('#sticky-anchor').offset().top; 
     if (window_top > div_top) { 
      jQuery('.mainmenu-area').removeClass('light-menu'); 
      //This is for when div in top   
     } else { 
      jQuery('.mainmenu-area').addClass('light-menu'); 
      //This is for when div in not top 
     } 
    } 

    jQuery(function() { 
     jQuery(window).scroll(sticky_relocate); 
     sticky_relocate(); 
    }); 
} 

Answer 2

JSHintは、あなたに警告を与えている。このようなものは、トリックを行いますので、

var sticky_relocate = function() { 

：

function sticky_relocate() { 

あなたはこれを行うことができます「これは最善の考えではないと思うが、あなたがそれをすることを許可する」と意味する。

コードを変更するには、いくつかの方法があります。

変更関数式に関数の宣言：

if(jQuery("header").attr("id") == "header-style-two") { 
    var sticky_relocate = function() { 
    var window_top = jQuery(window).scrollTop(); 
    var div_top = jQuery('#sticky-anchor').offset().top; 
    if (window_top > div_top) { 
     jQuery('.mainmenu-area').removeClass('light-menu'); 
     //This is for when div in top   
    } else { 
     jQuery('.mainmenu-area').addClass('light-menu'); 
     //This is for when div in not top 
    } 
    } 
    jQuery(function() { 
    jQuery(window).scroll(sticky_relocate); 
    sticky_relocate(); 
    }); 
} 

OR ifブロックのうち、関数定義を移動します。

if(jQuery("header").attr("id") == "header-style-two") { 
    jQuery(function() { 
    jQuery(window).scroll(sticky_relocate); 
    sticky_relocate(); 
    }); 
} 

function sticky_relocate() { 
    var window_top = jQuery(window).scrollTop(); 
    var div_top = jQuery('#sticky-anchor').offset().top; 
    if (window_top > div_top) { 
    jQuery('.mainmenu-area').removeClass('light-menu'); 
    //This is for when div in top   
    } else { 
    jQuery('.mainmenu-area').addClass('light-menu'); 
    //This is for when div in not top 
    } 
} 

Answer 3

if条件では関数宣言を使用できません。あなたはそれを外に置き、条件に基づいて呼び出すことができます。

var isHeaderStyleTwo = (jQuery("header").attr("id") == "header-style-two"); 
function sticky_relocate() { 
    var window_top = jQuery(window).scrollTop(); 
    var div_top = jQuery('#sticky-anchor').offset().top; 
    if (window_top > div_top) { 
    jQuery('.mainmenu-area').removeClass('light-menu'); 
    //This is for when div in top   
    } else { 
    jQuery('.mainmenu-area').addClass('light-menu'); 
    //This is for when div in not top 
    } 
} 

jQuery(function() { 
    if (isHeaderStyleTwo) { 
     jQuery(window).scroll(sticky_relocate); 
     sticky_relocate(); 
    }