2

http://jsfiddle.net/nhmbA/

In above link you'll find my working code. The issue is when you first click on Select For button, it'll show a list but again you click on the same button then the list should not be visible but its vice-versa.

I know, this is due to blur event applied to the list but I also want the list to be hidden when its clicked outside.

Help me to sort this minor issue..

3
  • Why not use toggle? Commented May 25, 2011 at 9:02
  • @mplungjan: toggle is buggy in IE<9... Commented May 25, 2011 at 9:13
  • Seriously? I had no idea. In what way? Commented May 25, 2011 at 9:42

3 Answers 3

3

In your code change

$('.tglrOptns').blur(function(){
    $(this).css('display', 'none').siblings('.optnTglr:first').removeClass('seltd');
});

to

$('body').click(function(e){

    $('.tglrOptns').css('display', 'none')
     .siblings('.optnTglr:first').removeClass('seltd');

});

and add this

$('.tglrOptns').click(function(e){
e.stopPropagation();
});

Demo

Sign up to request clarification or add additional context in comments.

1 Comment

jsfiddle.net/nhmbA/6 I have edited html code little bit on your updated code.. Please, see the bug..
0

I have added a close label, on clicking it closes the options div

Comments

0

hi if you change the on click function

to: $('.optnTglr').live('click', function(e){

this should help

1 Comment

it'll be the same as click and also its for applying click event to dynamically added elements... not for static

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.