Muszę przesuwać się / w dół lub po prostu pokazać i ukryć div, ale nie działa. Mój kod:

<div class="facilities">
            <div id="facheader">
                <div class="facheadname">
                    Facilities
                </div>
                <div class="facheaderbutton">
                    &#9651;
                </div>
            </div>
            <div id="factable">
                <table border="0">
                         <tr><div class="factableheader">
                         <th>Name</th><th>City</th><th>Country</th><th>Compliance Certification</th><th>Audit History</th><th>Date</th><th>Remediation History</th><th>Date</th></div>
                         </tr>
                         <tr>
                         <td>Kowloon</td><td>Hong Kong</td><td>Hong Kong</td><td>cGMP-FDA</td><td>Compliant cGMP-SeerPharma</td><td>12/12/10</td><td>Clean room staff training – IRB-C</td><td>01/03/05</td>
                         </tr>
                 </table>
            </div>
        </div>

Próbowałem kodu - ukrywa się zawartość, ale nie pokazuje się po ponownym naciśnięciu:

$('#facheader').click(function(){
            if ($('#factable').is(':hidden')){
                $('#factable').show();}
            else{
                $('.contclickedinfo').hide();
            }
            return false;
        });



        $('#factable').click(function(e) {
            e.stopPropagation();
        });
        $(document).click(function() {
            $('#factable').hide();
        });

Próbowałem też ich, ale wcale nie pracują:

$(document).ready(function(){
    $('#facheader').click(function(){
        $('#factable').slideUp(), function(){
        $('#factable').slideDown();
    });
});

I

$('#facheader').toggle(function(){ 

        $('#factable').slideUp(800);  // Text slides up 
        }, function(){ 

        $('#factable').slideDown(800); // Text slides down
    }); 
1
user1047517 15 listopad 2011, 16:17

3 odpowiedzi

Najlepsza odpowiedź

Krótki z funkcją przełączania

$("#facheader").click(function(){
    $("#factable").slideToggle(); /* between () you can define speed in MS */
});

Ponieważ nie jest to link, który wyzwala slajd, nie musisz zwracać fałszywych ani stoppropagacji.

Coś, co jest dziwne:

<tr><div class="factableheader">

Gdy przeglądarki to widzą, umieścią na zewnątrz stołu.

Czy używasz wielu Div z tym samym identyfikatorem?

0
Niels 15 listopad 2011, 14:19
$('#facheader').click(function() { 
    if ($('#factable').is(':visible'))
        $('#factable').slideUp(800);  // Text slides up 
    else
        $('#factable').slideDown(800); // Text slides down
}); 
0
OptimusCrime 15 listopad 2011, 14:11
$('#facheader').click(function() {
    if ($('#factable').is(':visible')){
        $('#factable').hide();
    } else {
        $('#factable').show();
    }

    return false;
});

To powinno działać tak, jak chcesz. Zmieniłem element, który chciałeś się ukryć, ponieważ wybrałeś inny element. Poza tym selektor :visible służył mi lepiej niż :hidden. Nie jestem pewien, dlaczego :hidden nie zawsze działa tak, jak się spodziewamy.

0
Tim S. 15 listopad 2011, 14:12