Question

我正在使用Jquery Ui示例来操作标签页http://jqueryui.com/demos/tabs/#manipulation。如果在创建第一个并在add事件中创建var然后在show事件中写入alert（var_created）时没有创建选项卡，那么它无法正确地告知var未定义，第二个，等等标签没有问题。

我在jsfiddle创建了一个脚本来显示它：

现在它应该打印一个警报，但它不起作用，如果你尝试，你可以看到错误与jslint taht告诉var未定义http://jsfiddle.net/paglia_s/5GU8M/1/

有办法避免它吗？

Answer 1

删除var

var var1 =“try”;应该是var1 =“try”;

我在您的链接http://jsfiddle.net/5GU8M/4/

上更正了它

为了清楚起见，这里是解释：

如果你使用'var myvar = 1'，变量只会在使用它的函数中处于活动状态。

如果你只声明'myvar = 1'，那么这个变量是全局的，并且可以在jquery函数之外工作，你可以从脚本的任何地方调用它。

Answer 2

我不知道jsFiddle。我的更改会自动保存吗？

您必须在较高范围内定义变量。否则，此var不在外部定义。

我做了以下事情：

var var1 = "";

$(function() {
var $tab_title_input = $("#tab_title"),
    $tab_content_input = $("#tab_content");
var tab_counter = 0;

// tabs init with a custom tab template and an "add" callback filling in the content
var $tabs = $("#tabs").tabs({
    tabTemplate: "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
    add: function(event, ui) {
        var tab_content = $tab_content_input.val() || "Tab " + tab_counter + " content.";
        $(ui.panel).append("<p>" + tab_content + "</p>");
        var1 = "try";

    },

    show: function(event, ui) {

        alert(var1);

    }
});

Answer 3

实际上您需要了解一些问题：变量范围和执行顺序。

变量范围：使用var声明的变量是本地范围（到最近的函数）。没有var声明的变量是全局范围。

执行顺序：当选项卡添加到没有任何现有选项卡的jQuery选项卡控件时，tabsshow事件将在tabsadd事件之前执行。因此，添加第一个选项卡时不会定义var1，因此变量未定义错误。

您可以在使用之前检查var1是否已定义：

if (typeof(var1) !== 'undefined') alert(var1);

或者，重新安排您的代码。

查看示例：http://jsfiddle.net/william/6fH4v/1/。

Jquery UI选项卡：显示在添加事件之前触发的事件

3 个答案: