jquery mostrar e esconder no mesmo link

Eu tenho uma div e quero mostrar e ocultar em um link de link. Não há dois links diferentes para mostrar e ocultar, mas apenas um. Eu usei toggle (), mas não está funcionando para mim ..

Aqui está o código

show-hide 
$().ready(function){ $("showhidediv").click(function(){ $("maindiv").hide() });

obrigado

Os seguintes trabalhos. Se você não conseguir fazer isso funcionar para seu projeto em particular, o problema está em outro lugar, e não no método de alternância ou na syntax do jQuery:

 $(function(){ $("a#showhidediv").click(function(){ $("#maindiv").toggle(); }); }); 

De seus comentários, pode ser que você queira usar $ .slideToggle ():

 $(function(){ $("a#showhidediv").click(function(){ $("#maindiv").slideToggle(); }); }); 

Com dois elementos flutuantes, você pode querer modificar um pouco sua marcação:

 
Foo
Bar

Tudo isso funciona como esperado, conforme demonstrado nesta demonstração on-line: http://jsbin.com/anaxi/edit e usando o slideToggle nesta demo: http://jsbin.com/anaxi/2/edit

Isso deve funcionar ( com a alternância )

 $('#showhidediv').click( function() { $('#maindiv').toggle();return false; } ); 

O seguinte geralmente funciona.

 $('#showhidediv').click(function(e) { $('#maindiv').toggle(); e.preventDefault(); // Stop navigation }); 

O que ele faz é chamar toggle () na div que você deseja mostrar / ocultar. Se você tem vários desses links e o div alterna sempre segue o link você pode fazer algo parecido com isto:

 $('.showhide').click(function(e) { $(this).next().toggle(); e.preventDefault(); // Stop navigation }); 

E o código HTML ficaria assim:

 Foo 
show me / hide me
Bar
show me / hide me

Espero que ajude.

Eu faço isso alterando o texto do link com base na visibilidade do div que você deseja alternar.

 if ($("#divToToggle").is(":visible")) $("#linkId")[0].innerText = "show"; else $("#linkId")[0].innerText = "hide"; $("#divToToggle").toggle(); 

Se a alternância não estiver funcionando para você por algum motivo, apenas use show () e hide () em divToToggle

Obrigado a todos por tentarem responder à pergunta e todos estavam certos.

Eu encontrei a solução. A seguir está a function jquery

 $("#showhide").click(function() { if ( $("#maindiv").is(":visible") ) { $("#maindiv").hide(); } else if ( $("#maindiv").is(":hidden") ) { $("#maindiv").show(); } }); 

você tentou:

 $('#showhidediv').click(function(){ $('#maindiv').toggle(); return false; // should return false to prevent page loading }) 

Todas as soluções acima devem funcionar. Eu não posso imaginar que seria algo em CSS que impediria que isso funcionasse.

Qual versão do jQuery você está usando?

você poderia tentar isso

 show-hide 
#....content goes here.....

funciona para mim, também confira este link

Código Javascript:

 $(".user-profile-info").unbind().click(function(){ if($( ".user-profile-info" ).hasClass("collapsed")){ $('#user-profile-submenu').css('display', 'block'); $( ".user-profile-info" ).removeClass("collapsed"); } else { $( ".user-profile-info" ).addClass("collapsed"); $('#user-profile-submenu').css('display', 'none'); } }); 

Código HTML :

  
Content of click