javascript - jQuery - 在函数之间共享变量

Question

这应该相当简单；我很确定我只是不理解它。

仅供引用，该网站正在使用 jQuery 在内容上运行 ajax .load()。

在我的主父页面上，标题中我有我的 nav .load() jQuery 代码:-

<script type="text/javascript" charset="utf-8">

    $(document).ready(function(){

        $('a.nav').click(function() {
            page = $(this).attr('page');
            projID= $(this).attr('projID');

            if($("#mainRight").is(":visible")) { $('#mainRight').hide(200); }

            switch(page) {

            case 'projSettings': $("#mainRight").load("content.php?load=" + page, { projID: projID}); break;
            case 'projMetrics': $("#mainRight").load("content.php?load=" + page, { projID: '5000227' }); break;
            case 'projTags': $("#mainRight").load("content.php?load=" + page, { projID: projID}); break;
            case 'projShare': $("#mainRight").load("content.php?load=" + page, { projID: '5000227' }); break;

            }
            $('#mainRight').show(300);

        });

现在，基本上我希望记住 projID，以便其他不提供它的 a.nav 点击使用。

调用此链接的 anchor 看起来像 <a page="projSettings" projID="522" class="nav">Settings</a>我会保存该 522。因此，其他请求(没有 projID，因为数据已加载到其他导航的 DOM 中，并且它们不知道 projID .我希望这是有道理的。

所以，我想知道如何拥有像 <a page="projSettings" class="nav">settings</a> 这样的链接当 projID 已在上次调用中使用时。

有什么想法吗？

Answer 1

好吧，讽刺的是，您已经在全局保存 projID (更好地说，在 window 对象 中，不使用 var 在你的声明中。

因此，一旦初始化，您就可以从代码中的任何位置访问 projID。

无论如何，这不是一个好的做法，相反，这是一个非常糟糕的做法。

我能想到的最好方法是创建您自己的应用程序对象，在其中存储所有数据并从那里访问它。

var your_application = {
    var foo  = 'bar',
        base = 'ball';        
};

// your_application.foo = 'another bar';

通过使用闭包和函数式编程，您可以将这一原则推得更远。存储和保存数据本地而非全局(窗口)的更好解决方案可能如下所示

var your_application = function(){
    var foo  = 'bar',
        base = 'ball';  

    return {
        getfoo: function(){
            return foo;
        },
        setfoo: function(newfoo){
            foo = newfoo;
        }
    };
});

var app = your_application();
app.setfoo('foobar!');
alert(app.getfoo());

这就是有条理 javascript 编程的理念。那里有一些好书，我建议从 Douglas Crockford 的 Javascript:优秀部分 开始。

另一个解决方案应该是 jQuery .data() 方法，它能够将数据存储在全局哈希中。

// store
$.data(document.body, 'projID', projID);

// access
var foo = $.data(document.body, 'projID');

// remove
$.removeData(document.body, 'projID');