Question

$(document).ready(function () {
    var id;
    $('.dropdown-menu a').click(function () {
        id = $(this).text();
        $('#selected').text($(this).text());
    });
    console.log(id);
});

我使用上面的代码从下拉列表中获取选定的选项，然后在我的所有JS文件中将该变量用作全局变量。但是，这在控制台中给了我一个undefined。如何让id在我的所有JS文件中充当全局变量。？

Answer 1

您不需要id作为全局变量，我无法看到这将是多么有利。

它的日志记录未定义，因为它在您调用时未定义，您只需在调用click事件后设置该值。

$(document).ready(function () {
    var id = "foo";
    $('.dropdown-menu a').click(function () {
        id = $(this).text();
        $('#selected').text($(this).text());

        console.log(id); // This will now log whatever was in your text value
    });
    console.log(id); //This will now log 'foo'
});

这就是你的代码在那一刻发生的事情

$(document).ready(function () {

    //You're not passing id a value, so it gets initialised as undefined.
    var id; 

    $('.dropdown-menu a').click(function () {
        id = $(this).text();
        $('#selected').text($(this).text());

        console.log(id); // This will now log whatever was in your text value
    });

    //The click event hasn't been called yet, so id is still undefined.
    console.log(id);

    //You've only assigned a click event above, you didn't call it, id will 
    //not get set until '.dropdown-menu a' has been clicked. 
});

虽然在你的问题范围之外，在回答你的评论时，为了使id成为一个全局变量，我会添加一个全局变量，而不仅仅是一个随机的id＆＃39;属性。

$(document).ready(function () {
    var App = window.App || (window.App = {});

    App.id = "foo";

    $('.dropdown-menu a').click(function () {
        App.id = $(this).text();
        $('#selected').text($(this).text());

        console.log(App.id); // This will now log whatever was in your text value
    });
    console.log(App.id); //This will now log 'foo'
});




//In some other JS file on your webpage / in scope
var App = window.App || (window.App = {});

console.log(App.id); //This should log the ID, providing it was called after the above code.

添加＆＃39; id＆＃39;作为一个全局是一个坏主意，是你最终可以用很多任意值填充全局命名空间，没有结构，因此很难维护代码，你冒险覆盖一个重要的全局命名空间上的属性，可能会导致您的网站/应用程序中出现未定义的行为。

拥有单个全局对象是一种可接受的利用全局命名空间的方式，而不会有意外覆盖其他变量的风险，并且调试您的Apps变量也更容易。

App对象的单个日志（无论你喜欢什么称呼它），（可能）只会记录你的应用程序创建的变量，因此你不必查看许多其他变量来找到你的变量。

如果你使用了我上面的代码建议，请比较这两个日志：

console.log(window.App); 

console.log(window); //The global namespace

你应该看到第一个日志打印出一个漂亮，干净的对象，只有你的变量＆＃34; id＆＃34;在内部，你应该在第二个日志中看到一大堆变量，事实上，你甚至可能需要在控制台中向下滚动才能找到你的“id”。变量

Answer 2

id是一个仅在您的$(document).ready()函数中可用的局部变量。如果要进行全局访问，请在任何函数之外定义它。这应该可以解决您的问题。您可以阅读有关范围Here的更多信息。

希望这有帮助！

Answer 3

你的代码未定义是对的。因为当页面加载但用户没有点击$（＆＃39;。dropdown-menu a＆＃39;）然后没有id变量的值。

$(document).ready(function () {
    var id;
    $('.dropdown-menu a').click(function () {
        id = $(this).text();
        $('#selected').text($(this).text());
    });
    console.log(id);
});

如果您仍想查看变量值，可以像这样修复

$(document).ready(function () {
    var id;
    $('.dropdown-menu a').click(function () {
        id = $(this).text();
        $('#selected').text($(this).text());
        console.log(id);
    });
});

希望这有帮助!!! =）

Answer 4

因为id的值仅在您点击$('.dropdown-menu a')时发生变化，但在您的就绪功能中，您可以无条件地打印出来。您在var id函数中定义了ready，然后定义了仅在单击事件中发生的函数，然后打印出id。在var id的定义和打印其值之间没有发生点击，因此没有任何改变，因此它仍未定义。如果您希望在点击修改代码后查看id的值是什么：

$('.dropdown-menu a').click(function () {
    id = $(this).text();
    $('#selected').text($(this).text());
    console.log(id);
});

点击.dropdown-menu a

后，这将在控制台中打印该值

Answer 5

var globalScope = globalScope || {};

$(document).ready(function () {   
    $('.dropdown-menu a').click(function () {
        globalScope.id = $(this).text();
        $('#selected').text($(this).text());
        console.log(globalScope.id);
    });   
});

警告：click是一个事件，您在事件注册未执行后正在记录id。如果您想在新关联后每次点击都记录它，请将其放入您的活动中。

使用javascript命名空间模式而不是将其从功能中删除，只是为了防止将来出现问题并对数据进行说明。

Answer 6

$(function()   // jquery
{
   $("#id Your Checkbox").Change(function()
    {
           var id = $(this).Val();
           // now , you can use of id.
           $("#test").text(id);
    });
});

为什么这个JQuery代码给我一个未定义的？

6 个答案: