2009-08-21 17 views
7

Załóżmy następujący kod HTML:Jak ukryć element nadrzędny za pomocą jquery?

<li class="fooli"> 
    <a class="foo" href="javascript:foo(this);">anchor</a> 
</li> 
<li class="fooli"> 
    <a class="foo" href="javascript:foo(this);">anchor</a> 
</li> 

i następujący Javascript (jQuery 1.3.2):

function foo(anchor) { 
    alert($(anchor).attr('href')); 
} 

Moim celem jest, aby być w stanie ukryć Li, który kliknął, ale nie można przypisać im unikatowych identyfikatorów. Dlatego chcę to zrobić w sposób pozycyjny (tj. Określić konkretną klikniętą kotwicę) przez coś takiego jak $ (anchor) .parent(). Hide().

Jednak powyższy alert zwraca "niezdefiniowany", więc nie jest dla mnie oczywiste, że mam nawet właściwy obiekt jquery.

Jak znaleźć obiekt $ (kotwica)? W szczególności, jak mogę zobaczyć, jakie ma atrybuty, jaką ma klasę, jaki jest element HTML, itp.?

Odpowiedz

16

nie można to zrobić:

$(function() { 
    $("a.foo").click(function() { 
    $(this).parent().hide(); 
    return false; 
    }); 
}); 

z:

<li class="fooli"><a class="foo" href="#">anchor</a></li> 
<li class="fooli"><a class="foo" href="#">anchor</a></li> 
+0

Dlaczego tak, mogę. Dobry pomysł! – dfrankow

7

$(...) w jQuery nie jest pojedynczym elementem HTML; zawsze jest ich lista.

Można użyć .get() konwertować do regularnych listy JavaScript lub lepiej wykorzystywać .each():

$(anchor).each(function() { alert(this) }); 

To daje coś takiego [object HTMLAElement]. Aby całkowicie go zbadać, musisz użyć for/in, ale prawdopodobnie są to wystarczające parametry, aby znaleźć miejsce, w którym się znajdujesz.

Lubię również użyć $(...).css('outline', '1px solid lime'), aby znaleźć elementy. To sprawia, że ​​trudno je przegapić i łatwo zlokalizować za pomocą Firebug.

Dodatek: Zdecydowanie zgadzam się z powyższą odpowiedzią dotyczącą oddzielenia kodu JavaScript od kodu HTML. Nie wpisuj JS.

+0

Dzięki za odpowiedź na pytanie, które zadałem. – dfrankow

Powiązane problemy