[Javascript] voor dummies (deel 9)

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
pi_67419938
Dat stukje code waar je vraag om ging staat er twee keer precies hetzelfde in. Dat kan je in ieder geval even in een variabele zetten. Je zou het ook in een functie zetten zodat je het kan hergebruiken.
Verder is het natuurlijk veel mooier om html via DOM te bouwen dan dia document.write.

1
2
3
4
5
6
7
8
9
10		   var parent = document.getElementById('id-van-het-element-waar-de-selectbox-in-moet-komen');
   var select = parent.appendChild(document.createElement('select'));
   for (var i = 1; i < 32; ++i)    
   {
      var value = (i < 10) ? '0' + i : i;
      var option = document.createElement('option');
      option.value = value;
      option.text = value;
      select.options.add(option);
   }


Beter leesbaar en beter voorbereid op de toekomst.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_67421636
Je hebt gelijk, al ben ik nog niet zo into createElement, maar begin steeds meer te leren :) ik zal het eens doorvoeren.

Heb ik gelijk weer een ander, iets wat ik niet snap (of het moet aan IE liggen).

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		function fieldsCheck(aaa, bbb, ccc)
{
    disableFields = false;
    if (document.getElementById('tmp_' + aaa).checked == true)
    {
         disableFields = true;
    }

    if (bbb != '' && document.getElementById('tmp_' + bbb).checked != true)
    {
         disableFields = false;
    }
    
    alert(disableFields);
    
    for (x = 0; x < ccc.length; x++)
    {
        document.getElementById('tmp_' + ccc[x]).checked = false;
        if (disableFields == true)
        {
            document.getElementById('tmp_' + ccc[x]).disabled = true;
        }
        else
        {
            document.getElementById('tmp_' + ccc[x]).disabled = false;
        }
    }
}


Deze code controllert of bepaalde checkboxjes zijn gevinkt of niet. Het rare is dat deze pas werkt als ik na het vinken van een checkbox ergens op de pagina KLIK. dus niet door de vink actie.

Extra html code voor deze functie

1
2
3
4
5
6
7		        <input type="checkbox" id="tmp_1a" name="1a" value="1a" /> 1a<br />
        <input type="checkbox" id="tmp_1b" name="1b" value="1b"  /> 1b<br />
        <input type="checkbox" id="tmp_1"  name="1" value="1" onchange="fieldsCheck('1', '', new Array('1a', '1b'));" /> 1<br />
        <input type="checkbox" id="tmp_2a" name="2a" value="2a" /> 2a<br />
        <input type="checkbox" id="tmp_2b" name="2b" value="2b" /> 2b<br />
        <input type="checkbox" id="tmp_2"  name="2" value="2" onchange="fieldsCheck('2', '', new Array('2a', '2b'));" /> 2<br />
        <input type="checkbox" id="tmp_3"  name="3" value="3" onchange="fieldsCheck('3', '', new Array('1a','1b','1','2a','2b', '2'));" /> 3 (alles)<br />


best raar, in FF werkt het direct als ik de vink plaats in de checkbox (1,2 of 3) maar in IE moet ik eerst ergens anderes klikken :{
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_67422510
De onchange gaat pas af nadat de checkbox de focus verliest. Je kan beter onclick gebruiken (die gaat ook af als je met het toetsenbord een vinkje aan/uit zet).
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_67422600
Ah, daar zit het verschil dus in! tnx weer wat geleerd!
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_67609982
Weet iemand ook een javascript functie die iedere pagina kan bookmarken (aan favorieten kan toevoegen) zondat dat ik de link op hoef te geven? dus zelf de huidige pagina achterhaalt?

onClick='window.external.AddFavorite(location.href, document.title);'>
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_67610534
Dat is een IE-only oplossing. Dus voor een goed werkende oplossign moet je nog even verder googelen.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_67611445
je hebt gelijk, ik heb al even verder gekeken maar er zijn zoveel stuks dat je door de bomen het bos niet meer ziet..

Deze werkt iig niet

http://javascript.about.com/library/blfav.htm
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_68138864
Weer een andere, ik wil een DIV van hoogte kunnen veranderen. Standaard is mijn div 200px maar als ik op een button klik wil ik graag dat deze div 300, 400, 500 (steeds 100px) groter wordt.

deze functie werkt iig niet
1
2
3
4
5		function gmapResize()
{
    c = document.getElementById('mapSrc');
    c.style.height = c.style.height + 100 + 'px';
}


al zou het in theorie moeten werken, wat doe ik fout?
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_68157013
Als je kijkt naar wat er in c.style.height staat, dan zie je vanzelf wat er fout gaat. Er staat 'px' achter, en '100px'+'100px' geeft '100px100px', niet '200px'.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_68161992
Oeh, hoe kan ik dit volgens jou oplossen dan? ik dacht dat de height propertie alleen maar een 'nummeriek' getal bevatte
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_68163132
quote:
Op zondag 19 april 2009 10:29 schreef Chandler het volgende:
Oeh, hoe kan ik dit volgens jou oplossen dan? ik dacht dat de height propertie alleen maar een 'nummeriek' getal bevatte
Met alert(c.style.height); kun je precies zien wat er in zit.
fokstok.nl
pi_68196344
juist ja, maar nu heb ik geprobeerd om zo
1c.style.height = '200px' 
aan te passen, maar dat werkte ook niet :{
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_68196884
quote:
Op maandag 20 april 2009 11:15 schreef Chandler het volgende:
juist ja, maar nu heb ik geprobeerd om zo
[ code verwijderd ]

aan te passen, maar dat werkte ook niet
is c.style.display niet per ongeluk "inline"?
Trotse poster van het 37000000ste bericht ^O^
pi_68236249
Misschien dat iemand mij kan helpen met het volgende probleem.

Ik heb een site gemaakt en daar zit een zoekveld in. Nu bestaat dit zoekveld uit 1 textfield, maar ik wil er een soort advanced search bij maken. Het advanced search gedeelte wil ik eigenlijk hidden onder een soort spoiler tag (net zoiets als fok's spoiler tags). De gebruiken moet dan eerst op het plusjes klikken om de geavanceerde textfield te kunnen zien

--------------------------------------------------------
voorbeeld:

<normale search textfield>
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
---------------------------------------------------

Ik heb even lopen googlen (en ff in bron code van fok gekeken), maar ik kom er eigenlijk nog niet uit. Keb in het verre verleden een beetje javascript gehad, maar dat is beetje weggezakt..
Dit keer zonder signature
pi_68260694
quote:
Op maandag 20 april 2009 11:33 schreef daReaper het volgende:

[..]

is c.style.display niet per ongeluk "inline"?
Yup, dat was het probleem, nu opgelost en werkt naar behoren!
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_68272463
Ik zoek een imageslideshow-scriptje die foto's om de x seconden laat infaden. Must is wel dat het 1 scriptje is, en niet allerhande backend zooi meeneemt. Moet het ook 2 keer met elke keer verschillende foto's op een pagina kunnen gebruiken.

Iemand die weet wat ik zoek?
pi_68273440
Nog beter gezegd: Hoe kan ik zorgen dat ik het volgende script, nog een keer kan gebruiken op dezelfde pagina?

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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94		<script language="JavaScript1.2">

//Fade-in image slideshow

var slideshow_width='465px' //SET IMAGE WIDTH
var slideshow_height='98px' //SET IMAGE HEIGHT
var pause=3000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds)

var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]="images/home/zakelijk/foto1.jpg"
fadeimages[1]="images/home/zakelijk/foto2.jpg"
fadeimages[2]="images/home/zakelijk/foto3.jpg"
fadeimages[3]="images/home/zakelijk/foto4.jpg"
fadeimages[4]="images/home/zakelijk/foto5.jpg"
fadeimages[5]="images/home/zakelijk/foto6.jpg"
fadeimages[6]="images/home/zakelijk/foto7.jpg"

////NO need to edit beyond here/////////////

var preloadedimages=new Array()
for (p=0;p<fadeimages.length;p++){
preloadedimages[p]=new Image()
preloadedimages[p].src=fadeimages[p]
}

var ie4=document.all
var dom=document.getElementById

if (ie4||dom)
document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div  id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>')
else
document.write('<img name="defaultslide" src="'+fadeimages[0]+'">')

var curpos=10
var degree=10
var curcanvas="canvas0"
var curimageindex=0
var nextimageindex=1


function fadepic(){
if (curpos<100){
curpos+=10
if (tempobj.filters)
tempobj.filters.alpha.opacity=curpos
else if (tempobj.style.MozOpacity)
tempobj.style.MozOpacity=curpos/100
}
else{
clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">'
nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0
setTimeout("rotateimage()",pause)
}
}

function rotateimage(){
if (ie4||dom){
resetit(curcanvas)
var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.style.zIndex++
var temp='setInterval("fadepic()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else
document.images.defaultslide.src=fadeimages[curimageindex]
curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0
}

function resetit(what){
curpos=10
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
if (crossobj.filters)
crossobj.filters.alpha.opacity=curpos
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=curpos/100
}

function startit(){
var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">'
rotateimage()
}

if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)

</script>
pi_68273556
quote:
Op dinsdag 21 april 2009 13:47 schreef Ericjuh het volgende:
Misschien dat iemand mij kan helpen met het volgende probleem.

Ik heb een site gemaakt en daar zit een zoekveld in. Nu bestaat dit zoekveld uit 1 textfield, maar ik wil er een soort advanced search bij maken. Het advanced search gedeelte wil ik eigenlijk hidden onder een soort spoiler tag (net zoiets als fok's spoiler tags). De gebruiken moet dan eerst op het plusjes klikken om de geavanceerde textfield te kunnen zien

--------------------------------------------------------
voorbeeld:

<normale search textfield>
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
---------------------------------------------------

Ik heb even lopen googlen (en ff in bron code van fok gekeken), maar ik kom er eigenlijk nog niet uit. Keb in het verre verleden een beetje javascript gehad, maar dat is beetje weggezakt..
Is niet zo moeilijk
1
2
3
4
5		<img src="http://i.fokzine.net/templates/new/i/plus.gif" onclick="javascript:document.getElementById('content').style.display = ( document.getElementById('content').style.display == 'block' ? 'none' : 'block');">

<span id="content" style="display: block;">

</div>


[ Bericht 2% gewijzigd door Darkomen op 22-04-2009 16:10:57 ]
pi_68278253
quote:
Op woensdag 22 april 2009 15:51 schreef Darkomen het volgende:

[..]

Is niet zo moeilijk
[ code verwijderd ]


ahh bedankt! precies wat ik zocht!
Dit keer zonder signature
pi_68303957
Vraagje, ik ben momenteel met mootools aan het klooien, zie http://stat.enliven.nl/mootools_test.php

Wat ik wil, is als ik een woord in het blauw vak sleep, deze hier netjes onder elkaar verschijnen, het liefst nog met een mooi effect.

Iemand die zin heeft om hier eventjes naar te kijken?
pi_68327202
Ik heb een submenu dmv mootools, en een fotoboek dmv jquery. Als ik deze beiden wil gebruiken geeft het een conflict, zet ik één van beiden uit doet een ding het dus wel.

Zou graag toch beiden willen gebruiken. Hoe kan ik dit conflict oplossen? Of weet iemand een leuk alternatief voor mootools.
pi_68327553
Je zou kunnen kijken naar de noConflict mode van jQuery: http://docs.jquery.com/Core

Misschien is datgene waar je MooTools voor gebruikt ook wel te doen met een jQuery plug-in. Even op Google zoeken.
pi_68327954
tvp
  woensdag 24 juni 2009 @ 14:13:37 #49
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_70323528
Vraagje:

Ik heb een textbox, waar je live(ajax) in kan zoeken.
Nu zou ik het zo willen, dat als er bijvoorbeeld 2 a 3 seconden geen toets is ingedrukt, hij de zoekopdracht verzend.

Opzich lukt dit ook wel, alleen heb ik het probleem dat hij uiteindelijk alle opdrachten verzend:
Dit heb ik nu:
1
2
3
4
5
6
7
8		   function validate (form) {
      
      var search = form.inputbox.value;
      
      if (search.length > 3){
         t = setTimeout("alert(search);",1000); 
      }
  }
pi_70323591
Je moet dus bij het opnieuw indrukken van een toets de reeds lopende timer stoppen.
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')