JQuery可以't从单独的javascript文件中查找变量

JQuery can't find variable from separate javascript file

本文关键字：javascript 文件 变量 查找 单独 可以 JQuery      更新时间：2023-11-18

我使用的是cakephp框架，我创建了两个单独的javascript文件，并将它们放在我的webroot/js文件夹中。第一个javascript文件包含模式对话框变量，这些变量包含对话框的设置。第二个javascript文件包含其他点击事件处理程序，它们将数据发布到操作，然后打开对话框。

我遇到的问题是，第二个文件使用$variablename，我收到一个错误，说没有定义varaibleName。

下面有一些代码来告诉你我的意思。来自第一个文件：

var $editSel = $("#editSel_dialog").dialog(
{
    autoOpen: false,
    height: 530,
    width: 800,
    resizable: true,
    modal: true,
    buttons:
    {
        "Cancel": function()
        {
            $(this).dialog("close");
        }
    }
});

来自第二个文件：

$('.neweditSel_dialog').live('click', function()
{
    $.ajaxSetup({ async: false });
    var selected = [];
    $("#[id*=LocalClocks]").each(function()
    {
        if(false != $(this).is(':checked'))
        {
            var string = $(this).attr('id').replace('LocalClocks', '');
            string = string.substring(10);
            selected.push(string);
        }
    });
    if(0 === selected.length)
    {
        $selError.dialog('open');
        $selError.text('No Local Clocks Were Selected')
    }
    else
    {
        $.post('/LocalClocks/editSelected', { "data[Session][selected]": selected }, function(data)
        {
        });
        $editSel.load($(this).attr('href'), function ()
        {
            $editSel.dialog('open');
        });
    }
    return false;
});

当我使用jquery-1.4.2.min.js时，这是有效的，但我现在使用的是jquery1.7。我还把第一个文件和所有变量放在了$(document).ready(function(){});中。我试着把第二个文件放在document.ready（）函数中，但没有什么区别。

任何帮助都会很棒。感谢

您正在处理范围中的一个问题。在javascript:中

function foo() {
    var greet = "hi";
}
function bar() {
    console.log(greet); // will throw error
}

但是：

var greet;
function foo() {
    greet = "hi";
}
function bar() {
    console.log(greet); // will log "hi"
}

您必须在需要访问变量的两个函数的公共父函数中定义变量。不幸的是，由于您没有使用任何建模约定或框架，这就是窗口对象（为什么全局变量不好？）。

因此，您必须在之前定义var $whateveryouneed，在之外定义$(document).readys。

同时，保持declaration和definition分离。您的定义实例化了一个jQuery对象，因此必须将其封装在$(document).ready()中（请改用$(function() {})）：

var $editSel;
$(function () {
    $editSel = $("#editSel_dialog").dialog(
    {
        autoOpen: false,
        height: 530,
        width: 800,
        resizable: true,
        modal: true,
        buttons:
        {
            "Cancel": function()
            {
                $(this).dialog("close");
            }
        }
    });
});

我认为您无法保证处理程序的启动顺序，这意味着文档就绪可能会以与您预期的不同的顺序启动。您试图在第二个文件中访问的变量是全局变量吗？试着想想你的变量范围，就像我认为的那样，这就是问题所在。

您不能保证一个文件会在另一个文件之前加载。您不能保证一个文件中的document.ready会在另一个文件之前启动。

因此，我建议您将代码封装在函数中，并按照需要的顺序在单个document.ready处理程序中调用它们。

例如：

function initVariables(){
    window.$editSel = ... // your code from the first file here
}
function initHandlers(){
    // your code from the second file here
}

然后：

$(document).ready(function() {
    initVariables();
    initHandlers();
});

您会注意到，我使用了全局window对象来公开您的变量。如果您为它们使用一个通用的名称空间，那会更好。

相关文章：