我试图使用函数中的变量，但该变量似乎确实有效，因为我试图在函数外部使用它。
我尝试使用的变量称为“viewportwidth”，我也在第一个“orientationchange resize”函数之后尝试使用它。
有没有办法在我的函数之外使用这个变量？我在名为“sidebarwidth”的新变量中的第一个函数下方尝试了它
请参阅下面的代码。有人可以帮忙吗？
$(window).bind("orientationchange resize", function(e) {
<?php if(strstr($_SERVER['HTTP_USER_AGENT'],'iPhone') || strstr($_SERVER['HTTP_USER_AGENT'],'iPod')) echo "$('#wrapper, #sidebar').addClass('iphone-min-height');" ; ?>
var viewportwidth;
var viewportheight;
// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
if (typeof window.innerWidth != 'undefined')
{
viewportwidth = window.innerWidth,
viewportheight = window.innerHeight
}
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
else if (typeof document.documentElement != 'undefined'
&& typeof document.documentElement.clientWidth !=
'undefined' && document.documentElement.clientWidth != 0)
{
viewportwidth = document.documentElement.clientWidth,
viewportheight = document.documentElement.clientHeight
}
// older versions of IE
else
{
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
viewportheight = document.getElementsByTagName('body')[0].clientHeight
}
$( '#wrapper' ).css( {
'width' : viewportwidth + 'px',
'height' : viewportheight + 'px'
});
var iWebkit;
if(!iWebkit){
iWebkit=window.onload=function(){
function fullscreen(){
var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++){
if(a[i].className.match("noeffect")){}
else{a[i].onclick=function(){
window.location=this.getAttribute("href");return false}}}}
function hideURLbar(){window.scrollTo(0,0.9)}iWebkit.init=function(){
fullscreen();
hideURLbar()
};
iWebkit.init()}}
}).trigger("resize");
var $openClose = $("span.open-menu"),
buttonwidth = $openClose.outerWidth(),
sidebarwidth = viewportwidth - buttonwidth,
$wrapper = $("#wrapper"),
$sidebar = $("#sidebar"),
menuOpen = false;
$sidebar.css({
'left' : '-210px',
'width' : sidebarwidth + 'px'
});
$openClose.on('click', function () {
if (menuOpen) { // run if button says "Close Menu"
$sidebar.stop().animate({ left: "-" + sidebarwidth + "px" }, 400);
$openClose.html("Menu");
$(this).addClass('active');
menuOpen = false;
} else { // run if button says "Open Menu"
$sidebar.stop().animate({ left: "0" }, 400);
$openClose.html("Close");
$(this).removeClass('active');
menuOpen = true;
}
});
最佳答案
你为什么要这样做？!
<?php
if( strstr($_SERVER['HTTP_USER_AGENT'],'iPhone')
|| strstr($_SERVER['HTTP_USER_AGENT'],'iPod'))
{
echo "$('#wrapper, #sidebar').addClass('iphone-min-height');" ;
}
?>
这简直是愚蠢!您应该设置 <body class="has-iphone"> 而不是使用 jQuery 来完成此操作。 。无需使用臃肿软件。
这毫无意义。
if (typeof window.innerWidth != 'undefined')
{
viewportwidth = window.innerWidth,
viewportheight = window.innerHeight
}
// IE6 in standards compliant mode (i.e. with a valid doctype as
//the first line in the document)
else if (typeof document.documentElement != 'undefined'
&& typeof document.documentElement.clientWidth !=
'undefined' && document.documentElement.clientWidth != 0)
{
viewportwidth = document.documentElement.clientWidth,
viewportheight = document.documentElement.clientHeight
}
// older versions of IE
else
{
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
viewportheight = document.getElementsByTagName('body')[0].clientHeight
}
没有人再支持 IE6，哪个是“旧版 IE”？你真的期望人们使用IE5.5吗？!这只是复制粘贴的糟糕情况......
<小时/>对于原来的问题，如果你想在两个或多个函数之间共享变量，并且不将其放在全局范围内，那么使用闭包:
var handlers = (function () {
var shared_variable,
current;
return {
click: function (e) {
// code for click handler
},
mouseover: function (e) {
},
mouseout: function (e) {
}
};
}()),
menu = document.getElementById('menu');
$(document).on('click', handler.click);
$(menu).on('mouseover', handler.mouseover);
$(menu).on('mouseout', handler.mouseout);
所有函数将共享 current变量，例如，在构建响应式菜单时非常有用。
P.S 另外，您应该尽量避免在 javascript 中设置 css 值。首先它违反了SoC它还会触发 Reflow在浏览器中您设置的每个值。
关于javascript - 使用另一个 jQuery 函数内部的变量，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10249499/