Question

jquery插件中，json返回的data如何被一个click事件的处理函数调用

准备做一个tree插件，刚刚开始，从后台返回整个tree，在json对象data中，已经把根节点都显示出来了，点击这些结点的时候，有个click事件，从data中获取这个结点的子节点并显示出来，但是在这些结点的click事件中，不知道怎么调用data。我可以再次到后台数据库中查询该结点的子节点，但是不想频繁和服务器交互，想一次查完放在data中，以后的操作都从这个data中找。以下是代码。

(function($) {
$.fn.jTree = function(options) {
var defaults = {
background : 'gray',
width : '200',
border : 'solid red 1px',
actionName : 'queryAllMenus.action'
};
// Extend our default options with those provided.
var opts = $.extend(defaults, options);
$(this).css("width", opts.width);
$(this).css("border", opts.border);

$(this).empty();
var data = queryAllMenus(opts);
createRoots(data, $(this));
// 查询所有的menu，把所有parent_id为零的结点显示出来，作为根节点
function queryAllMenus(opts) {
var retValue = null;
$.ajax({
url : opts.actionName,
context : this,
async : false,
success : function(data, status) {
retValue = data;
}
});
return retValue;
}
function createRoots(data, obj) {
for ( var i = 0; i < data.menuList.length; i++) {
if (data.menuList[i].PARENT_ID == 0) {
var node_name = data.menuList[i].NODE_NAME;
var leaf = data.menuList[i].LEAF;
var ul = $("<ul>").appendTo(obj);
if (leaf == 0) {
$("<li class='node'><input type='hidden' value='0' id='clicked'/>" + node_name + "</li>").appendTo(ul);
} else {
$("<li class='leaf'>" + node_name + "</li>").appendTo(ul);
}

}
}
}
// 点击非叶子节点的时候，判断是否点击过，如果没有点击过，查询它的子节点并显示，如果点击过，直接显示
$("li.node").click(function(event) {
if (this == event.target) {
if($(this).children("#clicked").val() == 0){

}
// $(this).children().toggle();
}
});
};
})(jQuery);

就是?红色的函数，想调用上面的var data = queryAllMenus(opts);的data的值，有什么办法吗？?

Answer 1

因为ajax是异步执行的

var data = queryAllMenus(opts);
createRoots(data, $(this));

所以执行createRoots函数时，data的值还未获取

你可以把createRoots(data,$(this))这段业务逻辑写在queryAllMenus函数中调用ajax的success回调函数中

追问

我已经做成非异步的了
async : false,

而且这个问题不是createRoots(data, $(this));的事儿，这个函数没有问题
问题是在$("li.node").click(function(event) 中怎么调用data的问题。data的值已经取出来了，没有问题。

追答

var data=queryAllMenus(opts); //这样定义不是全局变量
data=queryAllMenus(opts); //这样才表示全局变量

追问

好用，多谢多谢。请问只要这样定义data=queryAllMenus(opts); //这样才表示全局变量

data的作用域是整个闭包吗？
(function($) {

})(jQuery);

追答

只要是当前页面，所有的js中都可以调用，它的作用域就是整个页面！不过得注意加载的顺序

Answer 2

把 var retValue = null; 挪出去，放到全局变量里，这样 retValue = data 就是外部变量了。

追问

retValue的值已经赋给data了
var data = queryAllMenus(opts);

data不就是全局的吗？
现在是在$("li.node").click(function(event) 中怎么调用data的问题。