jQuery插入页脚时如何定义变量

Posted

技术标签:

【中文标题】jQuery插入页脚时如何定义变量【英文标题】:How to define variables when jQuery is inserted in the footer 【发布时间】:2012-05-08 06:51:39 【问题描述】:

我正在为在 html 文档末尾嵌入 jQuery 的 cms 编写插件。

我确实在我的模板代码中动态定义了一些变量:

<script>
    var name = '<?php echo $nameTakenFromTheDatabase; ?>';
</script>

此代码是我的插件的一部分,它不是嵌入在每个页面上。因此,name 并不是在每个页面上都定义的。

我也确实在一个单独的文件中有这个 javascript 代码(由 cms 自动添加到页面末尾):

var MyNamespace = (function() 

    MyClass = function(name) 
        // Do something with name
    

    return 
        MyClass: MyClass
    

)();

如果 jQuery 嵌入在顶部,我会在我的模板代码中做这样的事情:

<script>
    var name = '<?php echo $nameTakenFromTheDatabase; ?>';

    $(document).ready(function() 
        new MyNamespace.MyClass(name);        
    );
</script>

但是,由于 jQuery 包含在底部,我不能这样做($ 尚未定义)。我也不能只将 jQuery-DomReady 调用添加到单独的代码文件中,因为这是在每个页面上执行的,但 name var 并未在每个页面上初始化并破坏代码。

我能做什么?好旧的 document.ready 是明智的做法吗?

【问题讨论】:

根据您提出的解决方案和您描述的问题,我会说“好旧的 document.ready”是一个明智的方法。当然,如果你有一个更复杂的问题,但你在这里简化了它,那么我会投票给@aaberg 解决方案。 【参考方案1】:

您可以在脚本中定义方法,并从全局 javascript 文件中执行它们。

如果你在你的页面做这样的事情

<script>
    var name = '<?php echo $nameTakenFromTheDatabase; ?>';

    function runWhenReady()
        new MyNamespace.MyClass(name);        
    
</script>

然后在页面底部添加的全局文件中,您可以执行以下操作:

$('document').ready(function() 
    if (typeof runWhenReady != 'undefined') 
        runWhenReady();
    
);

如果您有创意,您可以将 'runWhenReady' 设置为一组方法,这些方法始终会在页面准备就绪时加载。

编辑我添加了一个使用数组的示例:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
</head>
<body>

    <script type="text/javascript">
        // check if array is already created. This is necessary if it is possible to render multiple pages which uses the runWhenReadyFunctions collection.
        if (typeof runWhenReadyFunctions == 'undefined')
            window.runWhenReadyFunctions = new Array();
        

        runWhenReadyFunctions.push(function()
            $('#testDiv').text('hello world!');
        );

        runWhenReadyFunctions.push(function()
            $('#testDiv2').text('hello another world!');
        )

    </script>


    <div id="testDiv"></div>
    <div id="testDiv2"></div>

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
        if (typeof runWhenReadyFunctions != 'undefined') 
            $.each(runWhenReadyFunctions, function(idx, func)
                func();
            );
        
    </script>

</body>
</html>

【讨论】:

我想我会这样做!【参考方案2】:

编辑——好的,你不应该把全局空间弄得乱七八糟,我不明白你为什么不把你的&lt;script&gt;标签放在你包含jQuery的标签下面。否则你可以进行 AJAX 调用

<script>


    $('document').ready(function() 
        $.getJSON('getmyname.php', function(data)
            new MyNamespace.MyClass(data.name);        
        );
    );
</script>

【讨论】:

我想到了 (MyNamespace_name) ...但我不喜欢将东西放在全局范围内的想法。我来自 PHP,我吸取了教训 ^^ @shredding 是的,你是对的,我的解决方案不是最佳的,但是你为什么不把脚本标签放在 jQuery 导入下面?我不明白为什么你不能这样做 CMS 是 Typo3,扩展名是 extbase。我有一个可以使用 PHP 变量的视图模板。无论视图放置在文档层次结构中的何处,都会添加此内容。我可以添加纯 Javascript 文件(添加到按钮),但 PHP 变量在那里不可用(实际上,它们没有被解析,只是被传递到浏览器)。我无法访问 cms,我只是在编写插件。 @shredding 你不能自己打一个 AJAX 调用来获取名字吗?我编辑了我的答案 @shreddin 如果你写 if(typeof MyNamespace_name !== 'undefined') 这个值是真的吗?这很奇怪

以上是关于jQuery插入页脚时如何定义变量的主要内容,如果未能解决你的问题,请参考以下文章

指定表格页脚时,最后一个单元格上的uitableview分隔符丢失

返回正确大小的页脚时,部分页脚中的 UITableView 随机白线

进入页脚时隐藏块

尝试使用 CSS 粘页脚时无法在移动设备中滚动

击中页脚时侧栏停止

指定表格页脚时,最后一个单元格上缺少 uitableview 分隔符