HTML / JAVASCRIPT: hoe gebruik ik een variabele in een html tag

**brenn** · 05/12/10 14:54

Hallo,

Het lijkt een simpele vraag, maar ik kom er (als beginner) niet uit.

Ik wil een extern javascript aanroepen via een <a href> link met een rel="" attribute. Mijn link staat in een globale variabele.

Het ziet er dus ongeveer zo uit:

Code:

<a href="javascript:variable" rel="thumbnail"> klik me </a>

Uiteraard moet bij de href dus een geldige opdracht staan.

Ik kom niet om de <a> tag heen dus via een function oproepen heeft geen zin (het script dat ik aanroep zoekt binnen de <a> tag.

Is hier een oplossing voor?

Thnx

**Ramon Fincken** · 05/12/10 15:42

onclick = "javacript:functionname();"

en dan in die functionname een window.open doen ofzo.

**vne** · 05/12/10 15:55

Oorspronkelijk geplaatst door Ramon Fincken

onclick = "javacript:functionname();"

en dan in die functionname een window.open doen ofzo.

je haalt hier 2 zaken dooreen...
ofwel zet je <a href="javascript:functionname();return false;">bla</a>
ofwel <a href="#" onclick="functionname();return false;">bla</a>

return false; zet je om te vermijden dat de browser de actie achter de klik op de link zou afbreken

**Ramon Fincken** · 05/12/10 15:57

De tweede inderdaad ! Scherp opgemerkt

**brenn** · 05/12/10 16:53

Dank voor de input, maar zoals ik in de post zei: ik MOET via een <a> tag het extern script aanroepen. Mij naar een function() verwijzen werkt niet, omdat het script dat ik aanroep een extern js script is en het de <a> tag analyseert. Zou ik het met een eigen function() aanroepen (document.open bv) dan mist hij de keywords '<a>'en 'rel="thumbnail"'.

Los van welk script of hoe mijn variabele tot stant komt... ik zoek de syntax om binnen de <a href> tags een variabele te verwerken. Dus niet via een omweg door een function heen.

Dat is de hele issue.

Thanks again!

**Triloxigen** · 05/12/10 16:56

En wat kan niet met onclick dan?

Wat je aan informatie geeft is te summier om je echt te kunnen helpen.

**The-BosS** · 05/12/10 17:02

Sluit me aan bij Triloxigen, trouwens een extern javascript kan je ook de functions etc van gebruiken hoor. Als je gebruik maakt van één of andere ajax gelieve dit dan even te vermelden met eventuele uitleg wat je precies probeert te bereiken.

**brenn** · 05/12/10 17:18

Ok... ik heb hier de code (ietwat aangepast voor duidelijkheid)

Code:

<head>
<title></title>

<!-- externe scripts -->

<link rel="stylesheet" href="./css/thumbnailviewer.css" type="text/css" />
<script src="./script/thumbnailviewer.js" type="text/javascript">
</script>

<!-- Locale scripts -->

<script type="text/javascript">
var picture; // globale variabele
</script>

<script type="text/javascript">
function changeDivs(p)
{
	if (p!='') {
		picture = 'images/p'+p+'.jpg';
		var pic = "url("+picture+")";
		document.getElementById("poster").style.backgroundImage = pic;
	};
}
</script>

</head>
<body onload="changeDivs('1')">

    <a href="javascript: global variable" rel="thumbnail"> 
        <div id="poster"> 
             <!-- dimensies worden in css benoemd en achtergrondplaatje door functie -->
        </div>
    </a>
        <ul>
            <li>
                <a href="javascript:changeDivs('1')">
                    <img src="thumbs/p1.jpg" width="50px" height="70px" />
                </a>
                <a href="javascript:changeDivs('2')">
                    <img src="thumbs/p2.jpg" width="50px" height="70px"/>
                </a>
                <a href="javascript:changeDivs('3')">
                    <img src="thumbs/p3.jpg" width="50px" height="70px"/>
                </a>
            </li>
          </ul>
<!-- etc. etc. -->
</body>
</html>

Hier staat de thumbnailviewer script

Hier loopt mijn site waarop het allemaal van toepassing is

Wat uiteindelijk mijn doel is:
Door op de title-links op mijn pagina te drukken veranderen diverse div's van informatie.
Dat lukt prima. Ik vind het prettig om niet bij elke link een hele nieuwe html pagina te openen.
Mijn wens is dat wanneer ik op de 'poster' klik die net door een variabele is geplaatst, dat plaatje alsnog in een thumbnailviewer wordt geopend. (de grote versie)
Omdat het elke keer een ander is, moet die 'poster' in zijn <div> dus door een function - cq variabele worden geplaatst.
Aangezien de URL dus al voorhanden is in mijn variabele hoop ik die te kunnen inzetten voor de thumbnailviewer.

Echter, ik zou niet weten hoe ik in dat script te werk kan gaan ZONDER de <a href> route, want wat ik uit dat script lees, is dat het echt op zoek gaat binnen de html tekst naar de <a> tag en de rel="thumbnail" tag.

Ik hoop dat het nu duidelijker is.

Dank

**Ramon Fincken** · 05/12/10 18:50

ok, je wil dus weten of 'pic' NET ook is geklikt, en als dat zo is .. doe dan iets anders ( lightbox) ?

**brenn** · 05/12/10 19:11

Zoiets.
Ik bedacht me net of ik niet via mijn function een <a href> tag kan plaatsen via innerHTML o.i.d. Van binnenuit de function zou ik die op kunnen bouwen met de 'picture' variabele in de href omschrijving. Heb het geprobeerd, maar met innerHTML lukt het niet. (als ik de <a> een id geef, kan ik die dan met innerHTML aanvullen?)

**vne** · 05/12/10 19:42

het zou mss een trukje kunnen zijn om 2 thumbnails te renderen. de ene zorgt voor het laden van de info en verbergt zichzelf en toont de 2e. De 2 opent de thumb in lightbox.
De 2e zet je standaard verborgen via een CSS class.
Bij het klikken op een "actie" thumbnail reset je ook de andere thumbnails zodat de vorige "lightbox" thumbnail terug een "actie" thumbnail wordt. Je kan via javascript checken welke CSS klasse er op een tag van toepassing is.

Onderwerp Gereedschap

Toon

Onderwerp: HTML / JAVASCRIPT: hoe gebruik ik een variabele in een html tag

HTML / JAVASCRIPT: hoe gebruik ik een variabele in een html tag

Labels voor dit Bericht

Webhostingtalk.nl

Link met ons

Partners

Contact