Jquery show/hide not working

I have this jquery script which suppose to hide/show div element base on the hyperlink that is clicked. I don't know why but it's not working at all. The following is the except of my code.

function hide_current_commoncontainer(commoncontainer){
   $(commoncontainer).each(function(){
 if(this.is(":visible")){this.hide();} 
 });
}

function init(){
$("#compose_link").bind("click",function(){
 hide_current_commoncontainer(".pmcommoncontainer");
 ("#composer").show();  
 return false;
 }
);

if(Drupal.jsEnabled){  
 $(document).ready(init);
} 

I've pinpoint the cause and found out that it is show/hide function which is not working. The rest - function calls - are ok. Can anyone tell me where I am doing wrong? Where should I amend my code in order 开发者_开发百科to hide/show div element as the way I wanted.

Ok I found out why $("#composer").show() is not working. It's because I hard-coded the visibility style of those divs to "hidden" and jquery's "show" method can't revert that. Strangely, as opposed to "show" method, "hide" can revert hard-coded "visible" style with no problem. So, to hide/show elements as intended, I either have to use hide/show method combo without no visibility style hard-coding or use css method of jquery and set the visibility style as desire.

You're missing the $ before ("#composer").show(); and this

Shouldn't it be $("#composer").show(); and $(this)? Also, make sure you've pulled in the definitions of show/hide

I'd suggest you do something like

$(function() {
    $('#compose_link').click(function(e) { 
        $('.pmcommoncontainer').children(':visible').hide();
        $('#composer').show();
        e.preventDefault();
    });
});

Which will show the element with the id of composer, and hide all visible child elements of the class pmcommoncontainer when the element with the id compose_link is clicked.

I think this is what you want to do - no need to iterate as jQuery works with sets :).

EDIT

Looks like you also wanted the click or post to be stopped - with events you can use the preventDefault() function to stop that behaviour.

I think that there are a couple of areas that need to be tweaked in your code sample.

REPLACE

("#composer").show();  

WITH

$("#composer").show();  

REPLACE

if(this.is(":visible")){this.hide();} 

WITH

if($(this).is(":visible")){$(this).hide();} 

jQuery's show() and hide() methods don't work on the CSS visibilty attribute. The effect can be achieved by using the css() function instead.

Change your code to

$(#composer).css('visibility', 'visible');

And

if($(this).is(":visible")){$(this).css('visibility', 'hidden');}

instead of this, you have to use $(this) for jquery objects.