2014-07-20 21 views
8

nella mia pagina, la risposta dal server viene visualizzato utilizzando questo avviso:Nascondi avviso quando click sul pulsante di chiusura, invece rimuoverlo

<div id="yes" class="alert alert-success" role="alert" style="display: none;"> 
     <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> 
     <strong>Pronto!</strong> cadastro efetuado com sucesso! 
    </div> 

C'è un modo per quando si fa clic sul pulsante Chiudi dal avviso, essere nascosto invece rimosso dalla pagina? Provo questo (seguenti istruzioni da here), ma senza successo:

$('#my-alert').on('close.bs.alert', function() { 
    $(this).hide(); 
}) 

UPDATE

cerco anche questo:

$('button.close').on("click", function(){ 
     $(this).parent().hide(); 
    }); 

ma ancora lo stesso problema, quando si fa clic nella pulsante di chiusura, l'avviso viene rimosso.

+1

'hide' non rimuove gli elementi, qual è il problema? – undefined

+0

@undefined Non voglio rimuovere, ma questo è ciò che accade quando clicco sul pulsante di chiusura. –

+0

L'elemento viene rimosso dal bootstrap non dalla chiamata 'hide'. – undefined

risposta

8

soluzione che ho trovato per questo problema:

Creare un nuovo attributo di dati per nascondere un elemento.

Javascript:

$(function(){ 
    $("[data-hide]").on("click", function(){ 
     $("." + $(this).attr("data-hide")).hide(); 
     // -or-, see below 
     // $(this).closest("." + $(this).attr("data-hide")).hide(); 
    }); 
}); 

e quindi modificare i dati-liquidano ai dati-nascondere nella marcatura. Esempio su jsfiddle.

$("." + $(this).attr("data-hide")).hide(); 

In questo modo nascondere tutti gli elementi con la classe specificata nei dati-pelle, cioè: data-nascondere = "alert" nasconderà tutti gli elementi con la classe di allarme.

basa sulla risposta scritto in questa discussione: Twitter Bootstrap alert message close and open again

-1

vostro stanno facendo male provare questo come nel tuo caso la classe Button è vicino e div id è sì

$('button.close').on('click', function() { 
    $("#yes").hide(); 
}) 
0

ho provato queste soluzioni, ma non funziona per me. Puoi farlo con sufficiente rimuovere "-licenziare i dati" attributo dal vostro markup e creare nuova funzione:

$('.alert').on('click','.close',function(){ 
     $(this).closest('.alert').slideUp(); 
    }); 
Problemi correlati