eGospodarka.pl
eGospodarka.pl poleca

eGospodarka.plGrupypl.comp.wwwjQuery i dziwne zachowanie
Ilość wypowiedzi w tym wątku: 3

  • 1. Data: 2013-02-25 17:54:30
    Temat: jQuery i dziwne zachowanie
    Od: Nazon <n...@p...gdzies>

    Witam.

    Od godziny próbuję znaleźć rozwiązanie następującego problemu* z jQuery:

    Chodzi mi o efekt dokumentu z kilkoma sekcjami, gdzie na początku tylko
    jedna jest widoczna w całości, a z pozostałych tylko nagłówki.
    Po kliknięciu nagłówka ukrytej sekcji powinna się ona pokazywać jednocześnie
    ukrywając tą już widoczną.
    W skrócie kod wygląda mniej więcej tak:

    [code]
    ...
    <style type="text/css">
    .toHide {
    color: red;
    }
    .toHide>p {
    display: none;
    }
    .toShow>p {
    display: show;
    }
    </style>
    ...
    <script type="text/javascript">
    $(function() {
    $(".toHide").click(
    function() {

    $(".toShow").toggleClass("toShow toHide");
    $(this).toggleClass("toShow toHide");


    }
    );
    }
    );
    </script>
    ....
    <article class="toShow">
    <h3>Nagłówek</h3>
    <p>Paragraf</p>
    <p>Paragraf</p>
    <p>Paragraf</p>
    </article>
    <article class="toHide">
    <h3>Nagłówek</h3>
    <p>Paragraf</p>
    <p>Paragraf</p>
    <p>Paragraf</p>
    </article>
    <article class="toHide">
    <h3>Nagłówek</h3>
    <p>Paragraf</p>
    <p>Paragraf</p>
    <p>Paragraf</p>
    </article>
    <article class="toHide">
    <h3>Nagłówek</h3>
    <p>Paragraf</p>
    <p>Paragraf</p>
    <p>Paragraf</p>
    </article>

    [/code]

    Problem jaki występuje - artykuł który w momencie załadowania dokumentu był
    widoczny, po tym jak zostanie ukryty nie reaguje już na kliknięcie (chociaż
    klasa mu się zmienia) i nie może zostać z powrotem pokazany.**


    *) Tak, jestem obecnie bardzo 'do tyłu' z frontendem :(
    **) Nie, nie szukam gotowca - tylko jakiegoś haczyka którego mógłbym się
    przyczepić żeby znaleźć powód takiego zachowania.

    --
    Nazon
    p...@j...w.mikronezji


  • 2. Data: 2013-02-25 19:56:23
    Temat: Re: jQuery i dziwne zachowanie
    Od: "Jordan Szubert" <u...@j...us.to>

    Dnia 25-02-2013 o 17:54:30 Nazon <n...@p...gdzies> napisał(a):

    > Witam.
    >
    > Od godziny próbuję znaleźć rozwiązanie następującego problemu* z jQuery:
    >
    > Chodzi mi o efekt dokumentu z kilkoma sekcjami, gdzie na początku tylko
    > jedna jest widoczna w całości, a z pozostałych tylko nagłówki.
    > Po kliknięciu nagłówka ukrytej sekcji powinna się ona pokazywać
    > jednocześnie
    > ukrywając tą już widoczną.
    > W skrócie kod wygląda mniej więcej tak:
    >
    > [code]
    > ...
    > <style type="text/css">
    > .toHide {
    > color: red;
    > }
    > .toHide>p {
    > display: none;
    > }
    > .toShow>p {
    > display: show;
    > }
    > </style>
    > ...
    > <script type="text/javascript">
    > $(function() {
    > $(".toHide").click(
    > function() {
    >
    > $(".toShow").toggleClass("toShow toHide");
    > $(this).toggleClass("toShow toHide");
    >
    >
    > }
    > );
    > }
    > );
    > </script>
    > ....
    > <article class="toShow">
    > <h3>Nagłówek</h3>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > </article>
    > <article class="toHide">
    > <h3>Nagłówek</h3>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > </article>
    > <article class="toHide">
    > <h3>Nagłówek</h3>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > </article>
    > <article class="toHide">
    > <h3>Nagłówek</h3>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > <p>Paragraf</p>
    > </article>
    >
    > [/code]
    >
    > Problem jaki występuje - artykuł który w momencie załadowania dokumentu
    > był
    > widoczny, po tym jak zostanie ukryty nie reaguje już na kliknięcie
    > (chociaż
    > klasa mu się zmienia) i nie może zostać z powrotem pokazany.**
    >
    >
    > *) Tak, jestem obecnie bardzo 'do tyłu' z frontendem :(
    > **) Nie, nie szukam gotowca - tylko jakiegoś haczyka którego mógłbym się
    > przyczepić żeby znaleźć powód takiego zachowania.

    chciałeś użyć http://api.jquery.com/live/ , ale nie wiedziałeś że istnieje?

    --
    Jordan Szubert


  • 3. Data: 2013-02-25 21:22:48
    Temat: Re: jQuery i dziwne zachowanie
    Od: Nazon <n...@p...gdzies>

    Jordan Szubert pisze:

    >
    > chciałeś użyć http://api.jquery.com/live/ , ale nie wiedziałeś że
    > istnieje?
    >

    Nie wiedziałem.

    Zresztą "As of jQuery 1.7, the .live() method is deprecated. Use .on() to
    attach event handlers."

    Z dokumentacji wynika że
    $(".toHide").click(function(){...});
    jest tożsame z
    $(".toHide").on('click',function(){...});

    Więc jak się można spodziewać też nie działa.

    Dopiero
    $(document).on('click', '.toHide', function(){...});
    zadziałało.

    Dzięki więc za haczyk i wędkę :)

    PS.
    Może mi ktoś wyjaśnić dlaczego tak wyszło?
    Z dokumentacji:
    /Event handlers are bound only to the currently selected elements; they must
    exist on the page at the time your code makes the call to .on()/

    i

    $(function(){...}) -> shorthand for $( document ).ready(function(){...})


    --
    p...@j...w.mikronezji

strony : [ 1 ]


Szukaj w grupach

Szukaj w grupach

Eksperci egospodarka.pl

1 1 1

Wpisz nazwę miasta, dla którego chcesz znaleźć jednostkę ZUS.

Wzory dokumentów

Bezpłatne wzory dokumentów i formularzy.
Wyszukaj i pobierz za darmo: