Problema con remove()

otto9due

otto9due

Utente Attivo
22 Feb 2014
591
25
28
Ho un piccolo problema con remove().
In pratica ho creato uno script esemplificativo che mi aiuterà poi a risolvere il problema che ho su quello originale ( per evitare di postare righe e righe inutili ).
In pratica: vorrei che cliccando su un pulsante contenuto in un div con classe es: prova sia cancellato il div stesso con tutto il suo contenuto. A tal proposito avevo costruito qualcosa del genere:
HTML: 
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("p:first").click(function(){
        $(this).closest("div.prova").remove();
    });
});
</script>
</head>
<body>

<div class="prova" style="height:100px;width:300px;border:1px solid black;background-color:yellow;">

<p>elimina</p>
<p>This is another paragraph in the div.</p>

</div>

<div class="prova" style="height:100px;width:300px;border:1px solid black;background-color:yellow;">

<p>elimina</p>
<p>This is another paragraph in the div.</p>

</div>

<div class="prova" style="height:100px;width:300px;border:1px solid black;background-color:yellow;">

<p>elimina</p>
<p>This is another paragraph in the div.</p>

</div>


</body>
</html>

Ma ovviamente non funziona, o meglio, non so per quale motivo funziona solo su uno dei div. Qualcuno ha qualche spiegazione?
 
Rikk73

Rikk73

Utente Attivo
7 Apr 2015
141
6
18
Arezzo
Modifica il selettore "p:first" in "div.prova p:first-child" (se elimina è sempre il primo p del contenitore da eliminare).
Credo che questo dipenda dal fatto che solo p:first si riferisca sempre e comunque al primo p del DOM, che dopo la prima eliminazione non vedi più.

Inoltre aggiungendo div.prova sei sicuro che l'evento è abbino solo a i p che sono in un contenuto "eliminabile", e non a tutti i "primi figli"...
 
  • Like
Reactions: otto9due
otto9due

otto9due

Utente Attivo
22 Feb 2014
591
25
28
Probabilmente non mi sono spiegato bene. Cliccando il "p" contenuto nel "div", o qualsiasi altro elemento a scelta ( es un pulsante ) il div stesso che contiene parte di un form deve scomparire..
456e12bd42aa3ddda2a1c528d056520e.jpg



Saluti.
G.G.
 
Rikk73

Rikk73

Utente Attivo
7 Apr 2015
141
6
18
Arezzo
Appunto, cliccando l'elemento che scatena l'evento, viene eliminato il contenitore padre.
Hai provato le modifiche che ti ho suggerito nel tuo esempio? A me sembra funzioni
 
  • Like
Reactions: otto9due
otto9due

otto9due

Utente Attivo
22 Feb 2014
591
25
28
Perdonami ma avevo omesso un particolare non di poco conto..
In pratica quello che dovevo fare era sostanzialmente aggiungere campi di un form e poterli cancellare.
Quello che non avevo calcolato è che gli elementi del dom che andavo ad aggiungere non erano stati inclusi nella prima funzione ready, quindi quando andavo a cancellarli non potevano essere trovati.
Quindi ho dovuto adottare questa soluzione che funziona:
Codice: 
$(document).ready(function(){
            $(document).on("click", ".selector", function(){
                $(this).closest(".selector").remove();
            });
        });
Il codice che ho scritto è un pò più articolato, ho cercato di ridurlo ai minimi termini qui, per renderlo disponibile a chi dovesse avere lo stesso problema.
Se a qualcuno servisse l'intero modello funzionante posso postarlo.

Grazie come sempre per l'aiuto.
 
Ultima modifica:
  • Like
Reactions: Rikk73
Devi accedere o registrarti per poter rispondere.
Discussioni simili
Autore Titolo Forum Risposte Data
O problema con dvr dahua xvr5116 IP Cam e Videosorveglianza 0
G Problema con Xampp Web Server 1
andrea barletta Problema con miniature comandi Photoshop 0
I problema con alice Posta Elettronica 0
N Problema con position absolute e overflow HTML e CSS 4
L Problema con inner join PHP 11
K [php] Problema con inner join PHP 4
K [PHP] Problema con variabili concatenate. PHP 1
O problema con query PHP 4
I problema con 2 account Posta Elettronica 1
L problema collegamento file css con html HTML e CSS 1
E Problema accesso a file con app sviluppata con MIT APP INVENTOR 2 Sviluppo app per Android 0
M Problema con Try Catch PHP 0
Sergio Unia Problema con gli eventi del mouse su una data table: Javascript 2
T PROBLEMA CON SESSIONI PHP 3
T ALTRO PROBLEMA CON ARRAY PHP PHP 1
R problema con else PHP 0
T PROBLEMA CON ARRAY PHP 8
L problema con query select PHP 2
R Problema query con ricerca id numerico PHP 2
F Problema con risposta PHP 0
S problema con recupero dati tabella mysql PHP 2
Z Problema con il mio tp-l i nk Reti LAN e Wireless 1
L Problema RAM con Tomcat 8 Apache 0
napuleone problema con sort e asort PHP 4
Z Problema con INT MySQL PHP 1
Z Problema database MySQL con XAMPP PHP 0
M Problema con controllo form in real time jQuery 6
Z Problema di sincronizzazione PAYPAL con PHP PHP 1
G Problema con Get page PHP 4
P Problema con require once PHP 6
P Problema con i package Java 1
A Problema login con Safari PHP 14
F INDESIGN: problema esportazione esecutivo per la stampa con foto B/N Webdesign e Grafica 0
S problema con css bootstrap3 HTML e CSS 4
M .load() problema con caricamenti dinamici di js Javascript 0
G Problema con eccessiva nitidezza apertura Camera Raw Photoshop 0
G Problema ------- con Query PHP 1
G Problema con Query PHP 1
T problema con select dinamica con jquery Javascript 0
S Problema con spazi bianchi HTML e CSS 5
A PROBLEMA: insert mysqli con dati Tagsinput Presentati al Forum 0
Tommy03 Problema con z-index HTML e CSS 3
M Problema inserimento parole con apostrofo nel db PHP 5
C Problema con dati meteo xml XML 1
S Problema con infrarossi videocamera IP Cam e Videosorveglianza 1
V Problema con librerie allegro5 c++ C/C++ 1
M Problema con php per calcolo costo percentuale PHP 7
S Problema con mysqli_num_rows PHP 18
grgfede Problema javascript con aruba Javascript 1

Discussioni simili

Alto Basso