Op deze website gebruiken we cookies om content en advertenties te personaliseren, om functies voor social media te bieden en om ons websiteverkeer te analyseren. Ook delen we informatie over uw gebruik van onze site met onze partners voor social media, adverteren en analyse. Deze partners kunnen deze gegevens combineren met andere informatie die u aan ze heeft verstrekt of die ze hebben verzameld op basis van uw gebruik van hun services. Meer informatie.

Akkoord

Vraag & Antwoord

Webprogrammeren & scripting

[javascript] Hyperlinks openen op basis van keuze

Anoniem
Anne
9 antwoorden
  • Ik hoop dat ik een beetje een goede titel heb gekozen. Het probleem is in iedergeval als volgt.

    Op basis van de keuze van de gebruiker, moeten hyperlinks in een nieuw venster geopend worden of juist niet. Nu krijg ik geen foutmeldingen, maar het scriptje doet niet helemaal wat ik wil.

    Met de functie maak ik de checkbox aan zodat mensen zonder javascript deze optie zoiezo niet krijgen. Daarna controleer ik of de checkbox gechecked is en laat ik de hyperlink openen in een nieuw venters, althans dat dacht ik.

    Is er iemand hier die weet wat ik fout doe?
    [code:1:3db47c6930]/* functie voor de externe link checkbox */
    function externalcheck(){
    if(document.getElementById){
    document.write ('|| <input type="checkbox" id="nieuwvenster" value="true" /><label for="nieuwvenster">Externe links in nieuw venster openen</label>');
    }
    }
    /* open in nieuw scherm volgens de standaarden, maar alleen als de checkbox aangevinkt staat */
    if(document.getElementById("nieuwvenster") == checked){
    var anchors = document.getElementsByTagName("a");
    for(var i=0; i<anchors.length; i++) {
    var anchor = anchors[i];
    if(anchor.getAttribute("href") && anchor.getAttribute("rel") == "external")
    anchor.target = "_blank";
    }
    }[/code:1:3db47c6930]-termin8or
  • In plaats van:
    if(document.getElementById("nieuwvenster") == checked)
    dit:
    if(document.getElementById("nieuwvenster").checked)

    Misschien ligt het daaraan?

    Ik krijg wel een foutmelding bij die eerste. Gebruik je nog ergens een variable checked?
  • Helaas, al geprobeerd en deze ook al:

    if(document.getElementById("nieuwvenster").checked == true)

    Maar die werken niet. Aangezien 'nieuwvenster' met javascript wordt gemaakt (dmv document.write), kwam Bas met een link om html elementen te creeren met javascript. Toen kwam ik op het volgende scriptje om het formuliertje (de checkbox) te krijgen:[code:1:d495582e0d]function externalcheck(){
    if(document.getElementById){
    var form = document.createElement('form');
    var input = document.createElement('input');
    input.setAttribute('type','checkbox');
    input.setAttribute('id','nieuwvenster');
    }
    document.body.appendChild('form');
    form.appendChild('input');
    }[/code:1:d495582e0d]Het probleem is dat deze ook niet werkt. Maar dit komt denk ik wel meer in de goede richting. Aangezien d.w hier niet voor bedoelt is denk ik.

    -termin8or
  • [quote:767a9842d6="termin8or"][code:1:767a9842d6]document.body.appendChild('form');[/code:1:767a9842d6][/quote:767a9842d6]En als je er nou eens body.appendChild('form'); van maakt, dus "document." verwijdert?

    - Bas
  • Dit zou moeten werken (werkt bij mij tenminste)
    [code:1:70397a3b74]
    <html><head></head><body>
    <a href="test" rel="external">test</a>
    <script type="text/javascript">
    if(document.getElementById){
    document.write ('|| <input type="checkbox" onclick="toggleblank()" id="nieuwvenster" value="true" /><label for="nieuwvenster">Externe links in nieuw venster openen</label>');
    }

    function toggleblank(){
    var anchors = document.getElementsByTagName("a");
    for(var i=0; i<anchors.length; i++) {
    var anchor = anchors[i];
    if(anchor.rel=="external") {
    document.getElementById('nieuwvenster').checked?anchor.target="_blank":anchor.target="_self";
    };
    }
    }
    </script>
    </body></html>
    [/code:1:70397a3b74]
  • Hulpje opzich zou jouw manier kunnen werken, maar het is niet helemaal de manier waarop ik het wil. Net heb ik er iets uit gekregen waardoor ik geen foutmeldingen meer krijg (ook niet met nn7.x formidabele javascript debugger). Dit is de code:[code:1:419d9569a1]/* functie voor de externe link checkbox */
    function externalcheck(){
    // - create the form element and it's attributes
    var f=document.createElement('form');
    f.setAttribute('action','');
    f.setAttribute('method','get');

    // - next, create a text input where you'll enter your name
    var i=document.createElement('input');
    i.setAttribute('type','checkbox');
    i.setAttribute('name','nieuwvenster');
    i.setAttribute('id','nieuwvenster');

    // - put a line break between the text node and the inputs
    f.appendChild(i);
    document.getElementById('externalonoff').appendChild(f);
    }
    if(document.getElementById('nieuwvenster')){
    if(nieuwvenster.checked){
    externallinks();
    }
    }
    /* open in nieuw scherm volgens de standaarden, maar alleen als de checkbox aangevinkt staat */
    function externallinks(){
    if (!document.getElementsByTagName) return;
    var anchors = document.getElementsByTagName("a");
    for (var i=0; i<anchors.length; i++){
    var anchor = anchors[i];
    if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "external")
    anchor.target = "_blank";
    }
    }[/code:1:419d9569a1]Het gedeelte om het formulier te creeren vond ik via een zeer handig zoekactie bij google, vandaar het Engels commentaar erbij. Ik hoop dat iemand me kan vertellen waarom het niet werkt. De bedoeling is dus dat als de checkbox is gechecked de links openen in een nieuw venster. Deze links maken gebruik van rel="external" en ik zou graag geen gebruik willen maken van onclick enz.

    -termin8or

    [size=7:419d9569a1]tipje http://www.pxl8.com/createElement.html ;)[/size:419d9569a1]
  • [code:1:bda5691500]
    <html><head></head><body>
    <a href="test" rel="external">test</a>
    <script type="text/javascript">
    if(document.getElementById){
    document.write ('|| <input type="checkbox" checked onclick="toggleblank()" id="nieuwvenster" value="true" /><label for="nieuwvenster">Externe links in nieuw venster openen</label>');
    }

    function toggleblank(){
    var anchors = document.getElementsByTagName("a");
    for(var i=0; i<anchors.length; i++) {
    var anchor = anchors[i];
    if(anchor.rel=="external") {
    document.getElementById('nieuwvenster').checked?anchor.target="_blank":anchor.target="_self";
    };
    }
    }
    toggleblank();
    </script>
    </body></html>
    [/code:1:bda5691500]
    De functie aanroepen is dan op zich voldoende om het te laten werken.
    Niet gechecked, dan worden de links met rel="external" in hetzelfde venster geopend, wel gechecked, dan worden ze in een nieuw venster geopend.
    De onclick zou je weg kunnen gooien, maar daar wordt het juist dynamisch door.

    Wat betreft jouw code. Je moet de functie externalcheck() aanroepen (maar dan moet je daarvoor wel eerst een divje of zo met id="externalonoff" hebben staan anders krijg je een foutmelding).
    Als je de checkbox checked wil hebben, dan moet je dit: i.checked='checked'; aan het einde van de functie zetten, nadat het checkbox-element aan het document is toegevoegd.
    Om de een of andere reden wil Internet Explorer anders dat attribuut niet zetten.
    Het hele document moet je aan het eind van het document zetten, net voordat de body wordt afgesloten. Dan zou dat ook moeten werken
  • Ik heb even snel iets in elkaar gezet wat doet wat jij wil (als ik het tenminste goed begrepen heb).
    Hopelijk kan je er wat mee.

    [code:1:ef665f3f31]
    <?xml version='1.0' encoding='iso-8859-1'?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns='http://www.w3.org/1999/xhtml'>
    <head>
    <title>external_links.html - External Link Test</title>
    <meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1' />

    <script type="text/javascript">
    /* functie voor de externe link checkbox */
    function createExternalCheck()
    {
    // - create the form element
    var f = document.createElement('form');

    // - next, create the checkbox
    var i = document.createElement('input');
    i.setAttribute('type', 'checkbox');
    i.setAttribute('name', 'nieuwvenster');
    i.setAttribute('id', 'nieuwvenster');

    // - apply the toggleExternalLinks function to the onclick
    // - eventhandler of the checkbox
    i.onclick = toggleExternalLinks;

    // - add the input to the form
    f.appendChild(i);
    // - add the form to the document
    document.getElementById('externalonoff').appendChild(f);
    }

    /* open in nieuw scherm volgens de standaarden,
    maar alleen als de checkbox aangevinkt staat */
    function toggleExternalLinks()
    {
    if (!document.getElementsByTagName) return;

    var sTarget = '_self';
    // - determine if checkbox for external links is checked
    if (document.getElementById('nieuwvenster').checked)
    {
    sTarget = '_blank';
    }

    var anchors = document.getElementsByTagName("a");
    for (var i=0; i<anchors.length; i++)
    {
    var anchor = anchors[i];
    if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "external")
    {
    anchor.target = sTarget;
    }
    }
    }

    window.onload = createExternalCheck;
    </script>
    </head>
    <body>
    <p>
    <a href="external_links.html" rel="external">external</a><br />
    <a href="external_links.html">internal</a><br />
    </p>
    <div id='externalonoff'></div>
    </body>

    </html>[/code:1:ef665f3f31]
  • Annie een woord: "Geweldig" :)

    Ik had het eerst gekopieerd in m'n funcies.js bestandje. En toen werkte het nog niet. Toen eerst alle andere functie eruit gesloopt en toen werkte het pas.

    Waarschijnlijk komt dat omdat er nog een andere window.onload in zat. Maar dat zoek ik zelf wel verder uit.

    -termin8or

Beantwoord deze vraag

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.