2014-12-03 5 views
0

Как использовать переменную от одной функции в другой? Я знаю, что это было задано и ответили, но я не смог применить эти решения к своему конкретному коду. Accessing variables from other functions without using global variablesHow to get a variable returned across multiple functions - Javascript/jQuery Я использую библиотеку под названием MP3RecorderJS по адресу https://github.com/icatcher-at/MP3RecorderJS. На странице демо HTML является следующий код:использовать переменную от другой функции

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
<title>MP3 Recorder test</title> 
</head> 
<body id="index" onload=""> 

<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript" src="mp3recorder.js"></script> 
<script type="text/javascript"> 
var audio_context; 

function __log(e, data) { 
    log.innerHTML += "\n" + e + " " + (data || ''); 
} 

$(function() { 

    try { 
    // webkit shim 
    window.AudioContext = window.AudioContext || window.webkitAudioContext; 
    navigator.getUserMedia = (navigator.getUserMedia || 
        navigator.webkitGetUserMedia || 
        navigator.mozGetUserMedia || 
        navigator.msGetUserMedia); 
    window.URL = window.URL || window.webkitURL; 

    var audio_context = new AudioContext; 
    __log('Audio context set up.'); 
    __log('navigator.getUserMedia ' + (navigator.getUserMedia ? 'available.' : 'not present!')); 
    } catch (e) { 
    alert('No web audio support in this browser!'); 
    } 

    $('.recorder .start').on('click', function() { 
    $this = $(this); 
    $recorder = $this.parent(); 

    navigator.getUserMedia({audio: true}, function(stream) { 
     var recorderObject = new MP3Recorder(audio_context, stream, { statusContainer: $recorder.find('.status'), statusMethod: 'replace' }); 
     $recorder.data('recorderObject', recorderObject); 

     recorderObject.start(); 
    }, function(e) { }); 
    }); 

    $('.recorder .stop').on('click', function() { 
    $this = $(this); 
    $recorder = $this.parent(); 

    recorderObject = $recorder.data('recorderObject'); 
    recorderObject.stop(); 

    recorderObject.exportMP3(function(base64_mp3_data) { 
     var url = 'data:audio/mp3;base64,' + base64_mp3_data; 
     var au = document.createElement('audio'); 

     au.controls = true; 
     au.src = url; 
     $recorder.append(au); 

     recorderObject.logStatus(''); 
    }); 

    }); 

}); 
</script> 

<div class="recorder"> 
    Recorder 1 
    <input type="button" class="start" value="Record" /> 
    <input type="button" class="stop" value="Stop" /> 
    <pre class="status"></pre> 
</div> 

<div class="recorder"> 
    Recorder 2 
    <input type="button" class="start" value="Record" /> 
    <input type="button" class="stop" value="Stop" /> 
    <pre class="status"></pre> 
</div> 

<pre id="log"></pre> 
</body> 
</html> 

В строке 56, есть переменная вар URL = 'данные: аудио/mp3; base64,' + base64_mp3_data;

Если я пишу новую функцию, как:

function testing() { 
console.log(url) 
} 

Как получить уаг URL в моей функции «тестирования»? Чтобы заставить его работать, я сделал скрытый div, сделал doublehtml равным var url, а затем ссылался на div в моей второй функции. Но это выглядит довольно хаки.

+1

Есть ли причина, вы не можете просто передать его на новую переменную стандартным способом, например, 'функция тестирования (URL) и' тестирование (URL); '? – Nerixel

+0

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

+0

Я просто попытался выполнить первое предложение Nerixel, но в своем консольном журнале я получаю «ReferenceError: testing not defined». – user3080392

ответ

-1

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

var url;

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

var hello; 
 

 
function changeVar() { 
 

 
    hello = 'hello'; 
 

 
} 
 

 
function displayVar() { 
 

 
    alert(hello); 
 

 
}
<button onclick="changeVar()">Change the variable to "hello"</button> 
 
<br/> 
 
<button onclick="displayVar()">Display the variable's value</button>

+0

Рекомендация глобальных переменных редко является лучшим вариантом. – jfriend00

+0

И почему это, @ jfriend00? –

+0

Хороший дизайн Javascript (и на самом деле хороший дизайн на большинстве языков программирования) использует как можно меньше глобальных переменных и инкапсулирует данные в объекты и передает его как аргументы, когда это возможно. Часто, когда некоторое постоянное состояние должно быть сохранено, оно может быть заключено в закрытие. Все это предотвращает непреднамеренные конфликты между различными фрагментами кода и поощряет хороший, безопасный дизайн данных. – jfriend00