获取父ID

时间:2010-04-19 21:51:07

标签: jquery jquery-ui parent attr

我有一堆如下的元素:

     <div class="droppableP" id="s-NSW" style="width:78px; height:63px; position: absolute; top: 223px; left: 532px;">  
 <div class="sensible"></div>  
      </div>  

他们都有类droppableP但显然有不同的id,我想将这个代码中的代码考虑在内我正在攻击。原始脚本只为这些div中的每一个都有一个特定的选择器,但代码是相似的,除了它做的事情的id,它是父的id或另一个与其相关的名称的div。以下是专门针对此div的原始代码:

$("#s-NSW > .sensible").droppable( {  
    accept : "#i-NSW",  
    tolerance : 'intersect',  
    activeClass : 'droppable-active',  
    hoverClass : 'droppable-hover',  
    drop : function() {  
        $('#s-NSW').addClass('s-NSW');  
        $('#s-NSW').addClass('encastrada');  //can't move any more..  
        $('#i-NSW').remove();  
        $('#s-NSW').animate( {  
            opacity: 0.25   
        },200, 'linear');  
        checkWin();  
    }  
 });  

这是我想要的因素,所以相同的代码可以完成所有这些,我最终也会链接,也许摆脱内联样式,但这是我的第一次去:

$(".droppableP > .sensible").droppable( {  
    accept :    "#i" + $(this).parent().attr('id').substring(2),   
    tolerance : 'intersect',  
    activeClass : 'droppable-active',  
    hoverClass : 'droppable-hover',  
    drop : function() {  
  $(this).parent().addClass($(this).parent().attr('id'));  
  $(this).parent().addClass('encastrada');   
  $("#i" + ($this).parent().attr('id').substring(2)).remove();   
  $(this).parent().animate( {  
      opacity: 0.25   
  },200, 'linear');  
  checkWin();  
    }  
});

我得到的错误是:

  

$(this).parent().attr("id")未定义

非常感谢。我已经浏览了与我最接近的相关问题,结果发现他们根本不需要父功能。我有点像菜鸟,所以如果这是一个愚蠢的问题,请不要太吵我。抱歉,我的格式很糟糕

2 个答案:

答案 0 :(得分:1)

您必须将每个可拖动元素传递给您要处理的函数,如果您的droppable接受它,则返回true。

尝试:

$(".droppableP > .sensible").droppable( {  
  accept : function(draggable) { 
    return $(draggable).attr("id") == "i" + $(this).parent().attr('id').substring(1);
},   

答案 1 :(得分:0)

这是有效的解决方案:我需要一个每个迭代器。我认为这是神奇的子弹。

     $(".droppableP > .sensible").each(function() {
        $(this).droppable( {
           accept :    "#i" + $(this).closest('.droppableP').attr('id').substring(1), 
           tolerance : 'intersect',
           activeClass : 'droppable-active',
           hoverClass : 'droppable-hover',
           drop : function() {
               //console.log($(this).closest());
               $(this).closest('.droppableP').addClass($(this).closest('.droppableP').attr('id'));
               $(this).closest('.droppableP').addClass('encastrado');
               $("#i" + $(this).closest('.droppableP').attr('id').substring(1)).remove();
               $(this).closest('.droppableP').animate( {
                     opacity: 0.25 
                  },
                  200, 
                  'linear'
               );
               checkWin();
           }
        }); 
 });