[Javascript] voor dummies (deel 9)

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
pi_74601679
D'oh!
Edit foutje
pi_74603473
quote:
Op woensdag 11 november 2009 12:52 schreef Darkomen het volgende:
Bekijk dit eens en kijk of je het kan toepassen aan jouw opdracht.
[ code verwijderd ]

Anders heb ik wel al de volledige oplossing voor je maar dan leer je niks
, ik heb het gefixed, het was wel even priegelen .

http://pastebin.com/m2115a045 (Ik heb het hier even gezet, het is namelijk veel tekst.)
pi_74603774
Moah, niet een heel net script enook niet crossbrowser/platfprm
if (Speler = 2), daar moet een dubbele =

Zonder de html erbij is het ook niet echt duidelijk wat er nu precies moet gebeuren.
pi_74626236
quote:
Op woensdag 11 november 2009 14:00 schreef Darkomen het volgende:
if (Speler = 2), daar moet een dubbele =
Nou, ik kan je vertellen dat het script niet werkt als ik dat doe.
Maar nou heb ik een nieuwe vraag, hoe kan ik een variabel maken van de knop waarop gedrukt word?
Zodat ik dus weet op welke knop gedrukt word.
pi_74628892
quote:
Op donderdag 12 november 2009 09:48 schreef Skonk het volgende:

[..]

Nou, ik kan je vertellen dat het script niet werkt als ik dat doe.
Maar nou heb ik een nieuwe vraag, hoe kan ik een variabel maken van de knop waarop gedrukt word?
Zodat ik dus weet op welke knop gedrukt word.
Zou er toch maar == van maken, nu staat er Speler wordt 2, wat dus altijd waar is
pi_74629340
quote:
Op donderdag 12 november 2009 11:23 schreef woopehh het volgende:

[..]

Zou er toch maar == van maken, nu staat er Speler wordt 2, wat dus altijd waar is
Speler 2 is toch ook aan de beurt?
pi_74629461
quote:
Op donderdag 12 november 2009 09:48 schreef Skonk het volgende:

[..]

Nou, ik kan je vertellen dat het script niet werkt als ik dat doe.
Maar nou heb ik een nieuwe vraag, hoe kan ik een variabel maken van de knop waarop gedrukt word?
Zodat ik dus weet op welke knop gedrukt word.
Dan klopt je script dus niet ;-)

The assignment operator = is used to assign values to JavaScript variables.
pi_74630533
quote:
Op donderdag 12 november 2009 09:48 schreef Skonk het volgende:

Maar nou heb ik een nieuwe vraag, hoe kan ik een variabel maken van de knop waarop gedrukt word?
Zodat ik dus weet op welke knop gedrukt word.
Kun je hier wat mee?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15		<html>
 <head>
   <title>Testpagina</title>
   <script type="text/javascript">
   function foo(btn) {
     alert(btn.id);
   }
   </script>
 </head>
 <body>
   <button id="testButton1" onclick="foo(this)">Test 1</button>
   <button id="testButton2" onclick="foo(this)">Test 2</button>
   <button id="testButton3" onclick="foo(this)">Test 3</button>
 </body>
</html>
fokstok.nl
pi_74632687
quote:
Op donderdag 12 november 2009 12:17 schreef Light het volgende:

[..]

Kun je hier wat mee?
[ code verwijderd ]


Ja, ik denk dat wel zou helpen, alleen mag ik geen onclick gebruiken in mijn HTML.
pi_74632854
Dan ga je dus combineren met wat we al hadden gegeven ;-)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24		<html>
 <head>
   <title>Testpagina</title>
   <script type="text/javascript">
   
   function bar() {
   document.getElementById('testButton1').onclick = foo2;
   document.getElementById('testButton2').onclick = foo2;
   document.getElementById('testButton3').onclick = foo2;
   }
   
   function foo2() {
     alert(this.id);
   }

   window.onload = bar;
   </script>
 </head>
 <body>
   <button id="testButton1">Test 1</button>
   <button id="testButton2">Test 2</button>
   <button id="testButton3">Test 3</button>
 </body>
</html>
  zondag 15 november 2009 @ 17:22:42 #236
12221 Tijn
Powered by MS Paint
pi_74719220
quote:
Op zaterdag 7 november 2009 17:04 schreef Light het volgende:

[..]

Maar je kunt de functie wel meerdere keren aanroepen:
[ code verwijderd ]
Hmm... ik zit hier toch nog een beetje mee te stoeien. Ik wil nu graag een variabele meegeven aan m'n ajaxfunctie. Deze variabele moet ik dan dus ook weer meegeven in de timeout-functie, maar dit werkt niet:

1setTimeout("ajaxfunction(" + variable + ")", 1000);


Wat is hier de goede syntax voor?

[edit] Oh wacht, ik heb het al... m'n variabele is een string, dus die moest ik ook nog even tussen enkele quotes zetten Nu werkt het wel:

1setTimeout("ajaxfunction('" + variable + "')", 1000);


[ Bericht 23% gewijzigd door Tijn op 15-11-2009 17:55:14 ]
Verberg de nieuwsticker
pi_74725257
Heeft iemand nog iets op te merken over mijn kleine scriptje dat middels php/json een select kan vullen?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65		function createSelect(id, params, selID)
{
    sel = document.getElementById(id);

    var openReq = createXMLHttpRequest();

    d = new Date();
    openReq.open("GET", "/selectoption/select.php?" + params + "&c=" + escape(d.getTime()), true);
    openReq.onreadystatechange = function()
    {
        if (openReq.readyState != 4) { return; }

        if (document.getElementById(id).length > 0)
        {
            to = document.getElementById(id).length;
            for (x = 0; x <= to; x++)
            {
                sel.remove(0);
            }
        }

        createSelectList(id,  eval('(' + openReq.responseText + ')'), selId);
    }
    openReq.send(null);
}

function createSelectList(id, list, selId)
{
    d = document.getElementById(id);
    selected = false;

    for ( var i in list )
    {
        var optNew   = document.createElement('option');
        optNew.text  = list[i];
        optNew.value = i;

        if (i == selId) { selected = true; } // found same ID as selected id? select is true

        try {
            d.add(optNew, null); // standards compliant; doesn't work in IE
        }
        catch(ex) {
            d.add(optNew); // IE only
        }
    } 

    if (selected == true)
    {
        d.selectedIndex = selId;
    }
}


function createXMLHttpRequest() 
{
    try { 
        return new XMLHttpRequest(); 
    } catch(e) {}
    try { 
        return new ActiveXObject("Msxml2.XMLHTTP"); 
    } catch (e) {}
    alert("XMLHttpRequest not supported");
    return null;
}


word op deze manier gebruikt :)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23		<html
<head>
    <title>test</title>
    <script type="text/javascript" src="index.js"></script>
</head>
<body>

<a href="javascript:createSelect('select', 'p=vis&type=roofvis', 1);">Roofvis</a> <br />
<a href="javascript:createSelect('select', 'p=vis&type=witvis', 11);">Witvis</a> <br />
<a href="javascript:createSelect('select', 'p=vis&type=zeevis', 1);">Zee vis</a> <br />

<select id="select" name="select">
</select>
<br />

<a href="javascript:createSelect('select1', 'p=div', 1);">Select 1</a> <br />

<select id="select1" name="select1">
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
<option value="4">option 4</option>
</select>


en mijn test php scriptje

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34		<?php
header('Content-type: application/json');

$p   = isset($_GET['p']) ? $_GET['p'] : '';
$arr = array();

switch ($p)
{
    case "vis":
        $t = isset($_GET['type']) ? $_GET['type'] : '';

        switch ($t)
        {
            case "roofvis":
                $arr = array(1 => "Snoek", 2 => "Snoekbaars", 3 => "Baars");
            break;

            case "witvis":
                $arr = array(1 => "karper", 2 => "Voorn", 3 => "Brasum", 4 => "Giebel", 5 => "Kopvoorn", 6 => "Zeelt", 7 => "Steur");
            break;
                
            default:
                $arr = array(1 => "Schol", 2 => "Zee baars");
            break;
        }
    break;
    
    default:
         $arr = array(0 => "Geen opties");
    break;
}

echo json_encode($arr);
?>


Comments zeer welkom, kan er alleen maar van leren :)
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_74742745
Ziet er in mijn ogen goed uit.
  maandag 16 november 2009 @ 13:40:16 #239
131734 klapvee
JSFreak (Javascript, JS100)
pi_74746529
quote:
Op zondag 15 november 2009 17:22 schreef Tijn het volgende:

[..]

Hmm... ik zit hier toch nog een beetje mee te stoeien. Ik wil nu graag een variabele meegeven aan m'n ajaxfunctie. Deze variabele moet ik dan dus ook weer meegeven in de timeout-functie, maar dit werkt niet:
[ code verwijderd ]

Wat is hier de goede syntax voor?

[edit] Oh wacht, ik heb het al... m'n variabele is een string, dus die moest ik ook nog even tussen enkele quotes zetten Nu werkt het wel:
[ code verwijderd ]


je kan ook het volgende doen:

1
2
3
4
5		  x= setTimeout(function(x,y,z) {
   //aanroep naar andere functie
    ajaxfunction(x,y,z);

}, 1000);


let er wel op dat het nu een anonieme functie is die je niet zomaar meer kan verwijderen :-)
Geen zinloze statements!
pi_74754826
quote:
Op zondag 15 november 2009 20:23 schreef Chandler het volgende:
Heeft iemand nog iets op te merken over mijn kleine scriptje dat middels php/json een select kan vullen?
[ code verwijderd ]

word op deze manier gebruikt
[ code verwijderd ]

en mijn test php scriptje
[ code verwijderd ]

Comments zeer welkom, kan er alleen maar van leren
  • Declareer variabelen met var. Zonder "werkt" het nu misschien ook wel, maar het kan je later in problemen brengen als ongewild variabelen overschreven worden.
  • document.getElementById(id) kost vrij veel tijd, dus roep die functie niet onnodig vaak aan. In createSelect heb je 'm maar 1 keer nodig, de uitkomst kan je zelfs weer doorgeven aan createSelectList.
  • function createSelect(id, params, selID) maakt geen select control, maar vult een bestaande met gegevens van de server. function createSelectList(id, list, selId) maakt ook geen select control, maar vult deze met de gegevens die je aanlevert.
  • try/catch kost ook vrij veel tijd. Als je van te voren al weet dat iets niet in IE gaat werken, gebruik dan gewoon een if/else. Helmaal als je het in een loop gebruikt. Je kan ook van te voren controleren of window. XMLHttpRequest bestaat, dan heb je ook geen try/catch nodig.
  • javascript in de href van een link
    quote:
    Op maandag 16 november 2009 11:21 schreef Darkomen het volgende:
    Ziet er in mijn ogen goed uit.
    Ik heb altijd wat te zeiken
    • Wil iedereen die in telekinese gelooft nu mijn hand op steken?
    | Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
    pi_74759393
    Tnx SR ik ga met je comments aan de slag.. is een onclick in href dan wel netjes?

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72    		var selOption = false;
    var d         = new Date();
    var openReq   = false;
    var selected  = false;

    function ajaxUpdateSelect(id, params, selId)
    {
        selOption = document.getElementById(id);

        if (selOption == false)
        {
            alert('Element bestaat niet');
            return false;
        }

        openReq = createXMLHttpRequest();

        if (openReq != false)
        {
            openReq.open("GET", "/selectoption/select.php?" + params + "&c=" + escape(d.getTime()), true);
            openReq.onreadystatechange = function()
            {
                if (openReq.readyState != 4) { return; }

                if (selOption.length > 0)
                {
                    to = selOption.length;
                    for (x = 0; x <= to; x++)
                    {
                        selOption.remove(0);
                    }
                }

                ajaxUpdateSelectList(eval('(' + openReq.responseText + ')'), selId);
            }
            openReq.send(null);
        }
    }

    function ajaxUpdateSelectList(list, selId)
    {
        selOption.selectedIndex = 0;

        for (var i in list)
        {
            var optNew   = document.createElement('option');
            optNew.text  = list[i];
            optNew.value = i;

            if (i == selId) { selected = true; } 

            selOption.add(optNew);
        } 

        if (selected == true)
        {
            selOption.selectedIndex = selId;
        }
    }


    function createXMLHttpRequest() 
    {
        try { 
            return new XMLHttpRequest(); 
        } catch(e) {}
        try { 
            return new ActiveXObject("Msxml2.XMLHTTP"); 
        } catch (e) {}
        alert("XMLHttpRequest not supported");
        return null;
    }


    deze is beter dus;)

    [ Bericht 48% gewijzigd door Chandler op 16-11-2009 20:23:49 (functie namen update ;)) ]
    The people who lost my respect will never get a capital letter for their name again.
    Like trump...
    pi_74773925
    quote:
    Op maandag 16 november 2009 18:07 schreef SuperRembo het volgende:

    [..]

  • Declareer variabelen met var. Zonder "werkt" het nu misschien ook wel, maar het kan je later in problemen brengen als ongewild variabelen overschreven worden.
  • document.getElementById(id) kost vrij veel tijd, dus roep die functie niet onnodig vaak aan. In createSelect heb je 'm maar 1 keer nodig, de uitkomst kan je zelfs weer doorgeven aan createSelectList.
  • function createSelect(id, params, selID) maakt geen select control, maar vult een bestaande met gegevens van de server. function createSelectList(id, list, selId) maakt ook geen select control, maar vult deze met de gegevens die je aanlevert.
  • try/catch kost ook vrij veel tijd. Als je van te voren al weet dat iets niet in IE gaat werken, gebruik dan gewoon een if/else. Helmaal als je het in een loop gebruikt. Je kan ook van te voren controleren of window. XMLHttpRequest bestaat, dan heb je ook geen try/catch nodig.
  • javascript in de href van een link
    [..]

    Ik heb altijd wat te zeiken
    • Dat van de 'var' ha dik ook nog kunnen vinden

    maar wat te gebruiken dan ipv getElementById ?
    pi_74774208
    @Darkomen: er is geen vervanging voor document.getElemenyById maar je kunt het maar beter zo minimaal gebruiken (dus niet meerdere keren als het niet nodig is)
    The people who lost my respect will never get a capital letter for their name again.
    Like trump...
      dinsdag 17 november 2009 @ 09:58:56 #244
    267444 Skonk
    Free Skonk
    pi_74774421
    quote:
    Op donderdag 12 november 2009 13:36 schreef Darkomen het volgende:
    Dan ga je dus combineren met wat we al hadden gegeven ;-)
    [ code verwijderd ]
    Ik ben er weer mee bezig, en ik had het ook aan de praat, waarvoor dank.
    Maar er worden drie knoppen ingedrukt in totaal, waarvan ik pas wil laten zien welke er worden gekozen als er op de laatste knop wordt gedrukt.
    Weet je misschien hoe ik dit moet doen?
    pi_74777134
    quote:
    Op dinsdag 17 november 2009 09:49 schreef Chandler het volgende:
    @Darkomen: er is geen vervanging voor document.getElemenyById maar je kunt het maar beter zo minimaal gebruiken (dus niet meerdere keren als het niet nodig is)
    oke, in princiepe doe je dat al als je iets schrijft. bedankt.

    @skonk, post dan eens precies de opdracht, je javascript en je html.
    Het is nu steeds gokken wat je nu wilt, oplossing plaatsen, dan weer een ander probleempje etc
    Dat tezamen met jouw kennis van Javascript (no offense, ik ben ook geen expert) maakt het erg lastig iets te schrijven.
      dinsdag 17 november 2009 @ 11:55:26 #246
    267444 Skonk
    Free Skonk
    pi_74777387
    quote:
    Op dinsdag 17 november 2009 11:46 schreef Darkomen het volgende:

    [..]

    oke, in princiepe doe je dat al als je iets schrijft. bedankt.

    @skonk, post dan eens precies de opdracht, je javascript en je html.
    Het is nu steeds gokken wat je nu wilt, oplossing plaatsen, dan weer een ander probleempje etc
    Dat tezamen met jouw kennis van Javascript (no offense, ik ben ook geen expert) maakt het erg lastig iets te schrijven.
    Ok, ik wil het wel doen, alleen het is wel een slordige code.
      dinsdag 17 november 2009 @ 11:58:52 #247
    267444 Skonk
    Free Skonk
    pi_74778729
    Wow.....dat krijg ik niet in tussen mn werk door herschreven/begrijpen.
    Ik heb wel je code aangepast, je enorme lijsten met buttons vervangen door een while loop
    Ook buttons die niet corssbrowser waren vervangen door document.getelementbyid
    Maar wat het script nu wanneer moet doen word me echt niet duidelijk.
    Dan zou ik echt eens wat langer moeten kijken.

    http://pastebin.com/m4b55d8a6

    Tip.
    Firefox: http://www.mozilla-europe.org/nl/firefox/
    Webdeveloper: https://addons.mozilla.org/nl/firefox/addon/60
    Daarin zit een javascript debugger.
    Begin met schrijven voor firefox, daarmee schrijf je een script welke door 99% van de browsers word geaccepteerd omdat zij zich wel aan de webstandaarden houden, IE versies lager dan 8 doen dit niet en accepteren veel rotzooi helaas
      dinsdag 17 november 2009 @ 12:51:39 #249
    267444 Skonk
    Free Skonk
    pi_74778863
    quote:
    Op dinsdag 17 november 2009 12:46 schreef Darkomen het volgende:
    Wow.....dat krijg ik niet in tussen mn werk door herschreven/begrijpen.
    Ik heb wel je code aangepast, je enorme lijsten met buttons vervangen door een while loop
    Ook buttons die niet corssbrowser waren vervangen door document.getelementbyid
    Maar wat het script nu wanneer moet doen word me echt niet duidelijk.
    Dan zou ik echt eens wat langer moeten kijken.

    http://pastebin.com/m4b55d8a6

    Tip.
    Firefox: http://www.mozilla-europe.org/nl/firefox/
    Webdeveloper: https://addons.mozilla.org/nl/firefox/addon/60
    Daarin zit een javascript debugger.
    Begin met schrijven voor firefox, daarmee schrijf je een script welke door 99% van de browsers word geaccepteerd omdat zij zich wel aan de webstandaarden houden, IE versies lager dan 8 doen dit niet en accepteren veel rotzooi helaas
    Ik schrijf al voor FireFox .
    Maar het is een soort spelletje (Rock, paper, scissors)
    pi_74779199
    in firefox waren je buttons niet disabled, en kreeg je gelijk de onderstaande foutmelding waardoor je script stopt

    Error: Button1 is not defined
    Source File: file:///C:/javascript/Copy%20of%20Noname1.html
    Line: 48

    Daarna button 2, 3, 4, 5 ... 24, 25 en dat voor elke button welke je niet had gedefineerd via getelementbyid
    Die fouten heb ik eruit gehaald en je krijgt dan geen javascript fouten meer.

    Probeer het script nav mijn code eens te herschrijven voor alleen 3 buttons, als dat allemaal werkt kan je er zoveel toevoegen wat je wil.

    Ik heb de komende tijd niet echt de tijd om te zoeken hoe het zou moeten werken.
    actieve topics nieuwe topics
    abonnement Unibet Coolblue Bitvavo
    [Javascript] voor dummies (deel 9)
    Index

    » digital corner

    » development

    Forum Opties
    Forumhop:
    Hop naar:
    (afkorting, bv 'KLB')