accedere al testo di un paragrafo dentro a un contenitore div

**artex** · 24-10-2014, 09:53

Ciao a tutti,
ho una piccola grande necessità.

ho dei contenitori <div> con classe contenitore e ognuno con un proprio id progressivo;
in ognuno di questi contenitori ho un paragrafo con classe txt e un proprio id progressivo (diverso da quello del contenitore)

devo gestire l'evento click su div con classe contenitore, accedere all'id del paragrafo contenuto nel contenitore e quindi prelevare il testo html.

come si fa?

codice:

       $("body").on('click', '.contenitore', function() {

           var idContenitore = $(this).attr("id");

           var idParagrafoNelContenitore = ??

　　　　/* ho provato con ma non funziona
           var idParagrafoNelContenitore = $("p.txt",this);  
　　　　alert(idParagrafoNelContenitore.html());
           */

       }

Grazie

p.s.
un membro del forum mi aveva già indicato qualcosa del genere ma nel mio contesto non funziona quindi ho deciso di aprire questo post limitato al problema specifico

**cavicchiandrea** · 24-10-2014, 10:50

$("body").on('click', '.contenitore', function() {

var idContenitore = $(this).find("p").attr("id");

var idParagrafoNelContenitore = idContenitore.html()

})

**artex** · 24-10-2014, 13:00

Grazie ma non va,
var idContenitore = $(this).find("p").attr("id");
funziona e mi dà già l'id del paragrafo

ma con idContenitore.html() non accedo al testo del paragrafo

var idParagrafoNelContenitore = idContenitore.html() // mi sembra che non abbia senso

**cavicchiandrea** · 24-10-2014, 13:10

E corretto cosi recuperi id
var idContenitore = $(this).find("p").attr("id");
cosi recuperi il testo
var testo = $(this).find("p").html()

**artex** · 24-10-2014, 14:00

controllo.

grazie

**carlomarx** · 25-10-2014, 17:57

Oppure (versione HTML0)…

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Documento HTML</title>
<script type="text/javascript">
function divClick (oEvent) {
    var oFirstP = this.getElementsByTagName("p")[0];
    alert(oFirstP ? "Id: \"" + oFirstP.id + "\"\nCodice HTML:\n\n" + oFirstP.innerHTML : "Paragrafo non trovato!");
}

function pageLoad () {
    for (var aDivs = document.getElementsByClassName("contenitore"), nIdx = 0; nIdx < aDivs.length; aDivs[nIdx++].onclick = divClick);
}

window.addEventListener ? addEventListener("load", pageLoad, false) : window.attachEvent ? attachEvent("onload", pageLoad) : (onload = pageLoad);
</script>
</head>

<body>

<div class="contenitore" id="genitore1">
    <p id="paragrafo1">Lorem ipsum 1</p>
</div>
<div class="contenitore" id="genitore2">
    <p id="paragrafo2">Lorem ipsum 2</p>
</div>
<div class="contenitore" id="genitore3">
    <p id="paragrafo3">Lorem ipsum 3</p>
</div>
<div class="contenitore" id="genitore4">
    <p id="paragrafo4">Lorem ipsum 4</p>
</div>

</body>
</html>

Oppure ancora (versione HTML5)…

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Documento HTML</title>
<script type="text/javascript">
function divClick (oEvent) {
    var oFirstP = this.querySelector("p");
    alert(oFirstP ? "Id: \"" + oFirstP.id + "\"\nCodice HTML:\n\n" + oFirstP.innerHTML : "Paragrafo non trovato!");
}

addEventListener("load", function () {
    for (var aDivs = document.querySelectorAll("div.contenitore"), nIdx = 0; nIdx < aDivs.length; aDivs[nIdx++].onclick = divClick);
}, false);
</script>
</head>

<body>

<div class="contenitore" id="genitore1">
    <p id="paragrafo1">Lorem ipsum 1</p>
</div>
<div class="contenitore" id="genitore2">
    <p id="paragrafo2">Lorem ipsum 2</p>
</div>
<div class="contenitore" id="genitore3">
    <p id="paragrafo3">Lorem ipsum 3</p>
</div>
<div class="contenitore" id="genitore4">
    <p id="paragrafo4">Lorem ipsum 4</p>
</div>

</body>
</html>

**artex** · 25-10-2014, 23:16

Grazie 1000

Discussione: accedere al testo di un paragrafo dentro a un contenitore div

Strumenti discussione

Ricerca discussione

Visualizza

accedere al testo di un paragrafo dentro a un contenitore div

Tag per questa discussione

Permessi di invio