Использовать переменную изнутри другой функции jQuery

Я пытаюсь использовать переменную из функции, но переменная, похоже, работает, потому что я пытаюсь использовать ее вне функции.Использовать переменную изнутри другой функции jQuery

Переменная, которую я пытаюсь использовать, называется «viewportwidth», которую я также пытаюсь использовать после первой функции «change change change».

Можно ли использовать эту переменную вне моей функции. Я попытался сделать это ниже первой функции в новой переменной под названием «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; 

    } 

});

источник

2012-04-20 Joshc

Почему вы это делаете?

<?php 
if(strstr($_SERVER['HTTP_USER_AGENT'],'iPhone') 
    || strstr($_SERVER['HTTP_USER_AGENT'],'iPod')) 
{ 
    echo "$('#wrapper, #sidebar').addClass('iphone-min-height');" ; 
} 
?>

Это просто глупо ! Вместо этого, используя jQuery для этого, вы должны установить <body class="has-iphone">. Нет необходимости использовать вирусы.

Это бессмысленно.

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 также, вы должны стараться избегать установки значений CSS в JavaScript. Прежде всего это нарушает SoC, а также вызывает Reflow в браузере при каждом установленном вами значении.

источник

2012-04-20 16:15:00

Google, Facebook и Microsoft больше не поддерживают IE6 (или, по крайней мере, рекламную поддержку). Поэтому я считаю, что можно покончить с этим. Корпоративные системы (правительство, банки и т. Д.), Которые все еще используют IE6, обычно ограничиваются подмножеством страниц или фиксируются в локальной интрасети, что отрицает утверждение о том, что эти пользователи по-прежнему осуществляются, не поддерживая IE6. Итак, +1 для каждой части этого ответа. Я бы хотел, чтобы я мог это сделать. – rlemon

Переместить переменную в большую область; он должен быть доступен для обеих функций.

Если они являются глобальными переменными, обе функции должны уметь их видеть.

источник

2012-04-20 15:59:10

Возьмите viewportwidth из функции resize сделать его глобальным или атрибутом некоего глобального объекта, то на изменение размера установить эту переменную onclick вычислить различные значения из viewportwidth и использовать их.

источник

2012-04-20 15:59:18

Объявление переменной за пределами обработчика для orientationchange и resize. Я также рекомендую обернуть все в закрытии, чтобы избежать загрязнения глобального пространства имен:

(function(){ 
    var viewportwidth; 
    var viewportheight; 

    $(window).bind("orientationchange resize", function(e) { 
    // Rest of your current code 

})();

источник

2012-04-20 15:59:38 bfavaretto

Спасибо, я все обернул. Но скажем, измените размер экрана, а затем запустите анимацию щелчка. Он по-прежнему использует исходное значение переменной, а не обновленную. – Joshc

Вы повторно обновляете 'viewportwidth' и высоту с помощью' var', где-нибудь еще на вашем коде? Если да, то нет. – bfavaretto

Использовать переменную изнутри другой функции jQuery

ответ

Смежные вопросы