jQuery item tekst selecteren

[Martin11468]

Goedemiddag,

Ik ben al de hele ochtend bezig met het aanpassen van een script maar ik krijg het niet voor elkaar.

De bedoeling is dat er in een popup tekst word getoond uit een divje op een pagina die door css standaard verborgen word.

Dit is de html pagins

HTML:

            <div class="item">
                <div class="itemImage">
                    <a href=image.jpg" class="preview" title="" name="" rel="lytebox"><img src="image.jpg"/></a>
                </div>
                <div class="itemDescription">
                    <span class="itemName">Itemnaam</span></div>
                    <div class="popupDescription">
  -->              <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,</p>    <--
                    </div>
            </div>

De tekst naast het pijltje moet getoond worden in een popup in dit script:

JavaScript:

    $("a.preview").hover(function(e){
        this.t = this.title;
        this.c = this.name;
        this.text = this.child("p");
        this.collection ="";
        var c = (this.t != "") ? "<br/>" + this.t : "";
        $("body").append("
<div id='preview'>
     <div id='previewImage'>
          <img src='"+ this.href +"' alt='Voorbeeldweergave'>
     </div>
     <div id='information'>
          <div class='collection'>"+ this.t +"</div>
          <div class='title'>"+ this.c +"</div><div class='zoom'>klik om te zoomen</div><div class='clear'>
     </div></div>

 --->   <div class='text'> "+ this.parent('p') +" </div></div>");       
                         
        $("#preview")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px")
            .fadeIn("normal");                      
    },
    function(){
        this.title = this.t;    
        $("#preview").remove();
    }); 
    $("a.preview").mousemove(function(e){
        $("#preview")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px");
    });         
};

De tekst uit de html moet in het javascript worden aangeroepen, en ik kom er niet uit hoe ik deze aan kan roepen. Zouden jullie mij de goede weg op kunnen helpen?

Bedankt alvast!

[zwippie]

Je wilt gewoon de tekst hebben?

JavaScript:

$(".popupDescription p").html()

Zoiets?

[Verwijderd]

Je moet de goede selector hebben, namelijk de innerHTML van de p, in class popupDescription. Dat doe je dus zo:

JavaScript:

var popUpText = $(".popupDescription > p").html();

of iets van gelijke strekking.

[Martin11468]

Verwijderd schreef op dinsdag 06 oktober 2009 @ 16:01:
Je moet de goede selector hebben, namelijk de innerHTML van de p, in class popupDescription. Dat doe je dus zo:

JavaScript:

var popUpText = $(".popupDescription > p").html();

of iets van gelijke strekking.

Met dit stukje code krijg ik inderdaad de tekst op de juiste plek, alleen ben ik niet helemaal duidelijk geweest over de opzet.

Er is niet één, maar meerdere items op een pagina. Met dit stukje code toont 'ie bij elk item dezelfde tekst bij de popup. het zal iets zijn met "this.parent", maar ik krijg het nog niet voor elkaar.

Mag ik hiervoor nogmaals een beroep doen op jullie als Javascript helden?

[zwippie]

Waarschijnlijk zul je de p of de parent van de p een id attribuut moeten geven en daar op selecteren.

[Martin11468]

bedankt voor je reactie, Ik heb het ondertussen werkend gekregen met de volgende code.

JavaScript:

var popUpText = $(this).parents("div.item").find(".popupDescription > p").html();