Установить переменную через загруженные страницы JQuery

Question

У меня есть страница, которая имеет 3 раздела. Слева статическое меню

например.

<a href="#" class="actionLink" id="newFile"><li>New File</li></a> 

Это может инициировать новые действия, например.

$('.actionLink').click(function() { 
    var folderID; // trying set ID here 
    var fileName = $(this).attr('id'); 
    $("#myAction").load('/ajax/actions/' + fileName + '.php?folder_id=' + folderID); 
}) 

Таким образом, это загружает /ajax/actions/newFile.php

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

например.

<span id="12" class="folder active99">Music</span> 

$('.folder').click(function() { 
    var folderID = $(this).attr('id'); 
    $("#myAction").load('/ajax/actions/links.php?folder_id=' + folderID); 
}) 

При нажатии на изображение отображается содержимое справа. Обратите внимание на переменную folderID. Все это работает нормально.

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

Я пробовал устанавливать переменную всюду, то есть во всех разделах var folderID;, но все, что я пытаюсь, не переносит переменную вокруг.

Возможно ли это или есть лучший способ сделать это? Неужели я ошибаюсь?

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

UPDATE

Это код, который я в настоящее время использую:

$(document).ready(function(){ 
      var folderID = ''; 
      $('.actionLink').click(function() { 
       var fileName = $(this).attr('id'); 
       $("#myAction").load('/ajax/actions/' + fileName + '.php?folder_id=' + folderID); 
      }); 

      $('.folder').click(function() { 
       $('.folder').removeClass('active99'); // remove from all other <SPAN>s 
       $(this).addClass('active99'); // add onto current 
       var folderID = $(this).attr('id'); 
       $("#myAction").load('/ajax/actions/links.php?folder_id=' + folderID); 
      }); 
     }); 

Я теперь изменил вещи немного так средняя секция фактически включена в отличие от использования .load(), но до сих пор не работает

Answer 1

Вы имеете дело с проблемой с переменной областью, вы должны объявить переменную folderID снаружи (в большей области), чтобы она была доступна для обоих действий:

$(document).ready(function(){ 
    var folderID = ''; 
    $('.actionLink').click(function() { 
     var fileName = $(this).attr('id'); 
     $("#myAction").load('/ajax/actions/' + fileName + '.php?folder_id=' + folderID); 
    }); 

    $('.folder').click(function() { 
     folderID = $(this).attr('id'); 
     $("#myAction").load('/ajax/actions/links.php?folder_id=' + folderID); 
    }); 
});