使用自引用函数实现Jquery父子dom的交叉

在jquery对象上使用.parents().each(function(){})遍历父级集合，该对象将沿着树向上走:

//use the dollar-sign at beginning if the argument name
//to hint that the fn is expecting a jquery object: 
function getDomData($activeElement){
    //start with the element that was clicked:
    var path = '/' + $activeElement.data('id');
    //then go over each ancester up the tree, check which
    //type it is, and append to the beginning of your path accordingly:
    $activeElement.parents().each(function(){
        if($(this).hasClass('list-group-item')){
            path = ('/' + $(this).data('id')) + path;
        }
        else if($(this).hasClass('list-group')){
            path = ('/' + $(this).data('type')) + path;
        }
    });
    return path;
};

小提琴:http://jsfiddle.net/mhfaust/4vHLP/1/

解决方案:

小提琴

$(document).on('click','.list-group-item', function(e){
    e.stopPropagation();
    path = getDomData($(this)); // books/1/chapter/2/page/1
    console.log(path);
});
function getDomData(activeElement){
    var activeElementId = activeElement.data('id'); 
    var activeElementParent = activeElement.closest('.list-group');
    var activeElementParentType = activeElementParent.data('type');
    var activeElementParentParent = activeElementParent.siblings('.list-group-item');
    var result = activeElementParentType +'/'+ activeElementId +'/';
    if(activeElementParentParent.length > 0){
        return getDomData(activeElementParentParent) + result;
    }
    return result;
}

变化:

• 使用var声明的结果(因此，它的值不会在递归中被覆盖)
• 返回if内部递归的结果(与当前结果连接)
• 从activeElementParent.parent更改为activeElementParent.siblings
• 更改ajaxPath返回result (ajaxPath未知)
• 添加console.log(path);(查看控制台的结果)