[Resolvido] Executar procedimento só após a conclusão da anterior

[Vitor Luis_78306 0]

Fala galera,

Estou tentando criar um "select" personalizado, baseado em uma <ul>, mas estou tendo alguns probleminhas na hora de fechar a lista quando se clica fora dela, acompanhem meu código:

 

HTML:

<div class="jSelect" id="TxtText">
<p>Select a item</p>
<span>ν</span>

<ul>
	<li id="Option 01">Option 01</li>
	<li id="Option 02">Option 02</li>
	<li id="Option 03">Option 03</li>
	<li id="Option 04">Option 04</li>
</ul>
</div>

 

CSS:

.jSelect		{ background:#FFF; font:13px 'Arial'; width:250px; height:25px; border:solid 1px #CCC; float:left; position:relative; z-index:95; }
.jSelect p		{ width:215px; height:17px; padding:4px 5px; margin:0; float:left; }
.jSelect span	{ color:#C00; font-size:15px; text-align:center; width:25px; height:19px; padding:3px 0; cursor:pointer; float:right; }

.jSelect ul		{ background:#FFF; border:solid 1px #CCC; border-top:none; width:213px; height:auto; list-style:none; padding:0 5px; margin:0; display:none; float:left; position:absolute; top:27px; }
.jSelect ul li	{ width:100%; height:auto; padding:3px 0; cursor:pointer; }

 

Javascript:

$('.jSelect span').click(function(){
$('.jSelect ul').slideDown('slow');

$(document).one('click', function(e){ 
	alert(e.target);
//		if(!$(e.target).closest('.jSelect').length){
//			$('.jSelect ul').slideUp('fast');
//		}
}); 
});

 

 

O problema é que, na minha visão, ele só deveria captar o clique e seu target após o clique no .Select span, logo, você clica no span, e a partir dai ele espera o próximo clique para verificar o target, só que não é bem isso que está acontecendo! Assim que clica no span (seta do select) ele já pega o target e acaba invalidando a função.

 

Como eu faço para que ele realmente capte apenas o clique que ocorre APÓS se clicar no '.jSelect span'?

[William Bruno 1501]

se eu entendi bem oque você quer, na verdade o problema é outro.

 

Faça o seguinte:

 

$('.jSelect span').click(function( e ){
       e.stopPropagation();

       $('.jSelect ul').slideDown('slow');
});
$(document).on('click', function(){ 
       $('.jSelect ul').slideUp('fast');        
});

[Vitor Luis_78306 0]

Willian,

Tinha testado seu código e até postei aqui que não tinha me ajudado muito e talz, mas depois de analisar um pouco mais os códigos e quebrar um pouco a cabeça vi que cometi alguns erros bestas e consegui resolver, muito obrigado!