YUI Library - Лучший способ сохранить глобальную ссылку на объект?

Question

Я пытаюсь использовать библиотеку истории yahoo ui. Я не вижу отличного способа обойти все содержимое моей функции с помощью Y.use, чтобы я мог получить доступ к объекту истории. Я попробовал объявить его глобально за пределами команды use(), но это, похоже, не сработало. Если вы посмотрите на мои методы showDashboard() и showReport1(), вы можете увидеть, что я обертываю содержимое, что кажется излишним, чтобы сделать это для каждой функции, использующей историю. Есть лучший способ сделать это?

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

<div> 
     <a href="#" onclick="showDashboard(); return false;">Dashboard</a> | 
     <a href="#" onclick="showReport1(); return false;">Report 1</a> 
    </div> 
    <script type="text/javascript"> 
     // Global reference to Yahoo UI object 
     var Y = YUI();  

     function showDashboard() { 
      Y.use('*', function (Y) { 
       var history = new Y.HistoryHash(); 
       history.addValue("report", "dashboard"); 
      }); 
     } 

     function showReport1() { 
      Y.use('*', function (Y) { 
       var history = new Y.HistoryHash(); 
       history.addValue('report', "report1"); 
       //var x = { 'report': 'report1', 'date': '11/12/2012' }; 
       //history.addValue("report", x); 

      }); 
     } 

     Y.use('history', 'tabview', function (Y) { 
      var history = new Y.HistoryHash(); 
      var tabview = new Y.TabView({ srcNode: '#demo' }); 

      // Render the TabView widget to turn the static markup into an 
      // interactive TabView. 
      tabview.render(); 

      // Set the selected report to the bookmarked history state, or to 
      // the first report if there's no bookmarked state. 
      tabview.selectChild(history.get('report') || 0); 

      // Store a new history state when the user selects a report. 
      tabview.after('selectionChange', function (e) { 
       // If the new tab index is greater than 0, set the "tab" 
       // state value to the index. Otherwise, remove the "tab" 
       // state value by setting it to null (this reverts to the 
       // default state of selecting the first tab). 
       history.addValue('report', e.newVal.get('index') || 0); 
      }); 

      // Listen for history changes from back/forward navigation or 
      // URL changes, and update the report selection when necessary. 
      Y.on('history:change', function (e) {     
       // Ignore changes we make ourselves, since we don't need 
       // to update the selection state for those. We're only 
       // interested in outside changes, such as the ones generated 
       // when the user clicks the browser's back or forward buttons. 
       if (e.src === Y.HistoryHash.SRC_HASH) { 
        if (e.changed.report) { 
         // The new state contains a different report selection, so 
         // change the selected report. 
         tabview.selectChild(e.changed.report.newVal); 
        } else if (e.removed.report) { 
         // The report selection was removed in the new state, so 
         // select the first report by default. 
         tabview.selectChild(0); 
        } 
       } 

       if (e.changed.report) { 
        alert("New value: " + e.changed.report.newVal); 
        alert("Old value: " + e.changed.report.prevVal); 
       } 
      }); 
     }); 
    </script> 
    </form> 
</body> 
</html> 

Answer 1

Вместо использования простой функции при щелчке присоедините обработчики с помощью YUI. Если вы можете изменить HTML код - добавить идентификатор или класс к ссылкам, например

<a id="btnShowDashboard" href="#">Dashboard</a> 

Затем в использовании() добавить обработчик щелчка к кнопкам

Y.use('history', 'tabview', 'node', 'event', function (Y) { 

    var bntShowDashboard = Y.one('#btnShowDashboard'); 
    if (bntShowDashboard) { 
    bntShowDashboard.on('click', function(e) { 
     e.preventDefault(); 
     var history = new Y.HistoryHash(); 
     history.addValue("report", "dashboard"); 
    }); 
    } 

... 
}) 

Таким образом, вы будете уверен, что на момент выполнения «история» загружается. НО есть один недостаток - до загрузки модулей YUI, если вы нажмете ссылки, ничего не произойдет.