2010-04-19 3 views
0

У меня есть куча элементов, как следующее:Получить родительский идентификатор

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

Все они имеют класс droppableP, но разные идентификаторы, очевидно, и я хотел бы учитывать код в этом сценарии я взлом на. В исходном скрипте есть определенный селектор для каждого из этих div, но код все одинаковый, кроме идентификатора, с которым он делает вещи, который является либо идентификатором родителя, либо другим 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") неопределен

Большое спасибо. Я просматривал связанные вопросы, которые, как я понимаю, ближе всего к моему, оказывается, что они не нуждались в родительской функции вообще. Я вроде как нуб, поэтому, пожалуйста, не кричите на меня слишком сильно, если это глупый вопрос. и жаль, что у меня ужасное время с форматом

+0

Что вы получаете, когда выполняете 'console.log ($ (this) .parent());'? – SeanJA

+0

где я помещаю это в середине буквального? –

+0

Я могу поместить его в функцию, я думаю. –

ответ

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(); 
      } 
     }); 
}); 
1

Вы должны передать каждый перетаскиваемый элемент в свою функцию для обработки и вернуть true, если ваш droppable принимает его.

попробовать:

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

+1 - @OP: Вероятно, вам не нужен селектор id jquery, '#', в вашем тесте и глядя на строки, вы бы хотели начать со 2-го символа в строке '.substring (1)', а не в 3rd – munch

+0

@munch Спасибо. Я не обращал особого внимания на манипуляции с строкой, а только на методологию. Я отредактировал свой ответ. – ghoppe

+0

oops yeah, мы хотим запустить подстроку с символом «-», который является char 1, а не char 2. Я думал, что это началось с #, но, конечно, этого не происходит. Я положил «#», потому что у этого фрагмента, который на самом деле работает (выше), есть он. –