onclickout

[manuparquegiralda]

No te funciona porque al pulsar el botón estás llamando a la función mostrar() y a su vez al evento click del document. Como cuando pulsas el botón éste no está dentro de #AjaxCapa20 en realidad lo que estás haciendo es abrir y cerrar simultáneamente.

Tienes que parar la propagación del evento cuando pulsas el botón para que no se haga el del click en el document. Utiliza la consola del navegador, para el javascript es una herramienta fundamental que te habría dado la respuesta. Algo así debería funcionarte.

Código HTML:

<a id="openAjax20" href="javascript:;">Boton</a>
<div id="AjaxCapa20">
    HOLA
</div>
 

Código Javascript:

$(document).on('click',"#openAjax20", function(e) {
    e.stopPropagation();
 
    if( $("#AjaxCapa20").is( ":hidden" )) {
        $("#AjaxCapa20").show(); 
    } else {
        $('#AjaxCapa20').hide();
    }
});
 
$(document).on('click', function(e) {
    if ( !$(e.target).closest('#AjaxCapa20').length ) {
        $('#AjaxCapa20').hide();
    }    
});