访问功能逻辑

$(window).on("load resize", function() { 
     if ($(window).width() < 768) { 
      menuHeight = '0px'; 
      contactHeight = '100%'; 
     } else { 
      menuHeight = ($('#desktop-menu').height() + 'px').toString(); 
      contactHeight = ($('.get-in-touch-home').outerHeight() + 'px').toString(); 
     } 
    });

的可变外欲该函数的外部访问这两个变量（menuHeight，contactHeight）在其他地方使用。我正在测量一个模态的顶部高度，但是它不会在调整大小时作出响应，而不仅仅是加载（在这种情况下，这似乎是一个简单的If/Else会起作用）。我可能需要一些关于范围的学习。谢谢！！访问功能逻辑

来源

2017-04-15 Chris Johnson

如果你还没有在某个地方声明'menuHeight'和'contactHeight'，那么这个代码就会陷入[隐式全局的恐怖]（http://blog.niftysnippets.org/2008/03/horror-of- implicit-globals.html）*（这是我贫血的小博客上的一篇文章）*。一定要声明你的变量。 :-) –

您需要定义他们：

var menuHeight = ''; 
var contactHeight = ''; 

$(window).on("load resize", function() { 
    if ($(window).width() < 768) { 
     menuHeight = '0px'; 
     contactHeight = '100%'; 
    } else { 
     menuHeight = ($('#desktop-menu').height() + 'px').toString(); 
     contactHeight = ($('.get-in-touch-home').outerHeight() + 'px').toString(); 
    } 
});

您可以使用一个函数：

function scroll() { 
    var menuHeight; 
    var contactHeight; 

    if ($(window).width() < 768) { 
    menuHeight = '0px'; 
    contactHeight = '100%'; 
    } else { 
    menuHeight = ($('#desktop-menu').height() + 'px').toString(); 
    contactHeight = ($('.get-in-touch-home').outerHeight() + 'px').toString(); 
    } 

    getHeight(menuHeight,contactHeight) 

} 

function getHeight(menuHeight,contactHeight) { 
    console.log(menuHeight,contactHeight) 
} 

$(window).scroll(scroll);

对于全局访问（不推荐）

window.menuHeight = ''; 
window.contactHeight = '';

来源

2017-04-15 13:22:03

不知道我是否可以使用'window'，因为这是一个Node项目，至少我在这里阅读; ）。 –

@ChrisJohnson：您的问题中的代码显然是基于浏览器的，并且已经使用'window'。 :-)您可能正在使用Node编写它的服务器部分，但这部分是基于浏览器的。但不要使用'window.menuHeight'等等;这样做需要它们是全局变量，这是一个坏事™。 –

@ T.J.Crowder他们是邪恶的:-)最后的手段使用全局变量，但大多数时候你不会需要它。 –

你外面的定义它们功能。另外，因为load在页面加载过程中发生得相当晚，所以您需要主动初始化它们，然后根据load和resize对其进行更新。这表明你想要一个可重复使用的功能：

var menuHeight;       // Defining... 
var contactHeight;       // ...them 
grabHeights();        // Proactive 
$(window).on("load resize", grabHeights); // And on events 

function grabHeights() { 
    if ($(window).width() < 768) { 
     menuHeight = '0px'; 
     contactHeight = '100%'; 
    } 
    else { 
     menuHeight = ($('#desktop-menu').height() + 'px').toString(); 
     contactHeight = ($('.get-in-touch-home').outerHeight() + 'px').toString(); 
    } 
}

如果你的代码是不是已经在一个范围的功能，你可能希望把它放在一个：

(function() { 
    var menuHeight; 
    var contactHeight; 
    grabHeights(); 
    $(window).on("load resize", grabHeights); 

    function grabHeights() { 
     if ($(window).width() < 768) { 
      menuHeight = '0px'; 
      contactHeight = '100%'; 
     } 
     else { 
      menuHeight = ($('#desktop-menu').height() + 'px').toString(); 
      contactHeight = ($('.get-in-touch-home').outerHeight() + 'px').toString(); 
     } 
    } 
})();

...因为全局是一坏事™。 :-)

你会看到别人告诉你先走一步，挂钩事件，然后手动触发它：

$("selector").on("event", function() { 
    // ... 
}).triger("event");

我不是一个球迷。如果你需要调用一个函数，只需调用它。

来源

2017-04-15 13:25:35

将继续尝试这些。谢谢！！ –

所以，我想能够在下面的代码中使用这个'更新'变量，但它似乎只是获得初始值。 '$（ “＃接触模态-1”）animatedModal（{ modalTarget： '接触模态'， animatedIn： 'slideInUp'， animatedOut： 'slideOutDown'，溢出： '滚动'，位置： 'fixed'， top：menuHeight， animationDuration：'。7s'， color：'#EBEBEB' }）;'对于不好格式化的道歉。 –

@ChrisJohnson尝试从我的代码getHeight（）函数。 –

访问功能逻辑

回答

相关问题