不知大家有没有遇到过类似的问题。用以下代码为例:
<ul class="cats">
<li class="list_item" value="1">类别1</li>
<li class="list_item" value="2">类别2</li>
<li class="list_item" value="3">类别3</li>
</ul>
我打算实现一个Ajax级联选择分类的功能,例如,当用户选择了“类别1”后,用Ajax向服务端请求“类别1”的所有子类别,同时用返回的子类别数据做一个同样的<ul class="cats">,方便再选择其下的子类别。
现在的问题在于js代码部分:
$(".list_item").click(function(){
var sel_cat = $(this).attr("value");
var data = {
cat_id: sel_cat
};
//Ajax获取子类数据,可以是json、xml或者是用PHP函数生成好的HTML代码
$.post(URL, data, function(){
//1. 用新的ul显示子类数据
//2. 绑定子类list_item的click事件,做一样的事情
});
});
关键是第2点,该用什么样的方法绑定才好呢?因为绑定的click函数就是匿名函数function()本身啊!想把这个函数单独抽取出来也不太可能,因为绑定操作是在其函数体里执行的。
jquery
javascript
function
------解决方案--------------------
事件委托
$(".list_item").live('click', function() {
//xxx
});