2013-11-30 3 views
2

Я хочу получить доступ к значению переменной a внутри var2() функции. Однако он дает ошибку, говоря, что значение не определено.Как получить переменную от одной функции к другой в javascript

<html> 
<head> 
<script type="text/javascript"> 
    function var1(data) 
    { 
     var a = data; 
    } 

    function var2() 
    { 
     var b = a; 
     alert(b); 
    } 
</script> 
</head> 
<body> 
    <a href="#x" class="overlay" onclick="var1(data)"></a> 
    <input type="button" value="Send" onclick="var2()" /> 
</body> 
</html> 

Пожалуйста, помогите мне.

ответ

1

Это вопрос объема. То, как вы его используете в своем коде, область видимости находится только в функции var1. Вам нужно определить его вне области видимости функции для того, чтобы быть доступным для других функций:

var a; 
function var1(data) 
{ 
    a = data; 
} 
+0

благодаря своей работе – user3048785

2

попробовать ниже код

var a; 
function var1(data) 
{ 

    a= data; 

} 



function var2() 
{ 

    var b = a; 
    alert(b); 
} 
+0

благодаря его работе – user3048785

3

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

<html> 
<head> 
<script type="text/javascript"> 
var a,b; 
    function var1(data) 
    { 

     window.a = data; 

    } 

    function var2() 
    { 

     window.b = window.a; 
     alert(window.b); 
    } 
</script> 
</head> 
<body> 
<a href="#x" class="overlay" onclick="var1(data)"></a> 
<input type="button" value="Send" onclick="var2()" /> 
</body 
</html> 

Попробуй! : D

+0

Нет необходимости в ' window'. – leaf

+0

Хотя, как правило, очень сложно определить многие переменные в глобальном пространстве. Вы должны объяснить, почему кто-то должен писать 'var a' на глобальном уровне и почему вы затем предлагаете его получить и установить с помощью' window.a'. И вы, по крайней мере, должны наметить опасности глобальных переменных. Что, если ОП думает назвать их, например, 'name',' title' или что-то подобное, в реальном коде? –

+0

благодарит за работу – user3048785

0

Это происходит из-за объема переменных. Это означает, что переменные внутри функций не доступны для других функций, которые находятся на одном или более высоком уровне. Функции могут использовать, но использовать переменные, которые были сделаны на более высоком уровне.

Если вы хотите получить доступ к этой переменной, попробуйте ее вернуть.

function var1(data) { 
    return data 
}; 

function var2() { 
    var b = var1("This string is a"); // b = "This string is a" 
    alert(b); 
}; 

В этом контексте это не имеет никакого смысла.

0

Сначала объявляем переменные, прежде чем сделать функцию:

jsfiddle

var a = "test"; 
function var1() { 
    document.getElementById('data').value = a; 
} 

function var2() { 
    var b = a; 
    alert(b); 
} 
0

В то время как вы уже приняли ответ, что нужно отметить, что это вообще плохая идея, чтобы определить, что-то в глобальном пространстве (независимо от того, является ли это переменной или функция).

Проблема с глобальным охватом заключается в том, что в браузерах уже есть много вещей. В текущих браузерах 500+ переменные, определения и функции определены там, и существует высокий риск конфликтов имен. Если существует конфликт имен с вашим именем переменной и уже определенным, результаты могут быть неожиданными и сложными для отладки (распространенными ошибками являются top, , parent, name, self, title). Проблема в том, что они либо влияют на поведение вашего браузера, либо что они читаются только, и вы не сможете ничего хранить внутри них.

Если вы измените свой пример, чтобы использовать имя top вместо a и вы определили его в глобальном масштабе ваш мог бы, вероятно, выглядеть следующим образом:

var top; 

function var1(data) { 
    top = data; 
} 

function var2() { 

    var b = top; 
    alert(b); 
} 

var1(1000); 
var2(); 

Теперь вы бы ожидать, что alter(b) является 1000, но это (в зависимости от браузера) [object Window], потому что top только для чтения и будет по-прежнему ссылаться на окно top.

Если вы думаете, используя имя location, то это намного хуже, и ваша страница будет перенаправлена ​​на новое место.

Та же проблема для функций, если вы назвать одну из вашей функции с именем уже используется браузером в глобальном масштабе (независимо от того, если это переменная или функция) вы получите ошибка как:

Uncaught TypeError: function '....' has already been declared

Таким образом, вы должны проверить каждый браузер в каждой версии вы хотите поддержать, если эти переменные будут защищены. И даже тогда вы не знаете, что вводится для будущих версий. Поэтому вы всегда должны стараться избегать писать что-то в глобальном масштабе как можно больше.

решения, которое позволило бы избежать, чтобы написать что-то в глобальном пространстве будет выглядеть следующим образом (с помощью jQuery для атташе событий, потому что вы упоминаете в тегах)

<script type="text/javascript"> 
/* define an anonymous function and directly call it 
    that param '$' is used to alias jQuery to a short name, 'undefined' is used 
    to be sure that it is really undefined 
    ('undefined' is not a protected keyword and could have been overwritten) 
*/ 
(function($, undefined) { 
    var a; /* limits the visibility of 'a' to the scope of the 
       anonymous function (not visible in the global scope) */ 

    /* defines the function 'var1' in the scope of the anonymous 
     function (not visible in the global scope) */ 
    function var1(data) 
    { 
     a = data; 
    } 


    /* defines the function 'var2' in the scope of the anonymous 
     function (not visible in the global scope) */ 
    function var2() 
    { 
     var b = a; 
     alert(b); 
    } 

    /* 
    because the functions 'var1' and 'var2' are not 
    visible in the global scope you need define the 'click' 
    handlers from within this scope. 
    */ 


    /* 
    Register the click events using event delegation. 

    So for every element with the attribute 'data-action="call-var1"' var1(data) 
    is called and the same for 'data-action="call-var2"' 
    */ 
    $(document).on('click', '[data-action="call-var1"]', function() { 
     var1(data); // I don't know what 'data' is in your example 
    }); 

    $(document).on('click', '[data-action="call-var2"]', function() { 
     var2(); 
    }); 

    })(jQuery); /* we pass jQuery as parameter when calling the anonymous 
       function for the case '$' is not not jQuery */ 
    </script> 
</head> 
<body> 
    <a href="#x" class="overlay" data-action="call-var1"></a> 
    <input type="button" value="Send" data-action="call-var2" /> 
</body> 
Смежные вопросы