[Javascript] voor dummies (deel 10)

vrijdag 5 februari 2010 @ 21:54:25 #1

Ericjuh

BLUB!

Potverdikkie! post ik zonder het te weten de laatste reactie.. nahh dan maar ff nieuwe topic!

De (voorlopige) OP van de [Javascript] voor dummies reeks.
Hier kan je alle vragen stellen over Javascript en alles wat er mee te maken heeft.

Heb je een probleem, post dan ook even de code waar het probleem zit

Zo kunnen we je beter proberen te helpen.

Vorige delen:
#1 - [Javascript] voor dummies - Deel 1
#2 - [Javascript] voor dummies - Deel 2
#3 - [Javascript] voor dummies - deel 3
#4 - [Javascript] voor dummies - deel 4
#5 - [Javascript] voor dummies (deel 6)
#6 - [Javascript] voor dummies (deel 6)
#7 - [Javascript] voor dummies (deel 7)
#8 - [Javascript] voor dummies (deel 8)
#9 - [Javascript] voor dummies (deel 9)

Handige links:
Quircksmode Javascript
Javascript Cheat Sheet
_{Mis je een link? Geef even een gil in het topic}

Tutorials:
W3Schools Javascript
W3Schools AJAX

Let op! Verwijder je post niet.
Als je bijvoorbeeld zelf al een antwoord hebt gevonden, laat ons dan even weten hoe je het hebt opgelost.
Wel zo aardig.

Laatste posts uit het vorige topic:
{Hier de laatste twee posts uit het vorige topic}

_{Deze OP: http://wiki.fok.nl/index.php/OP/Javascript}

[ Bericht 1% gewijzigd door Jo0Lz op 13-06-2010 10:15:10 ]

Dit keer zonder signature

vrijdag 5 februari 2010 @ 21:57:51 #2

Ericjuh

BLUB!

quote:
Op vrijdag 29 januari 2010 11:27 schreef Skonk het volgende:
Ons spelletje is af!
www.rockpaperscissorsultimate.tk

Keb hem hier in FF getest, maar hier werkt hij niet:

Ik zie btw dit:

Dit keer zonder signature

vrijdag 5 februari 2010 @ 22:00:07 #3

Trollface.

gr rob fruithof, groningencity

quote:
Op vrijdag 5 februari 2010 21:57 schreef Ericjuh het volgende:

[..]

Keb hem hier in FF getest, maar hier werkt hij niet:

Ik zie btw dit:

[ afbeelding ]

Werkt hier in FF/3.6.

★5731U★ Death from above '79★You're a woman, i'm a machinielsie ★ ✠ ★ Telkens weer een beetje sterven★ I was born in a winterstorm, i live there still★

vrijdag 5 februari 2010 @ 22:01:15 #4

Ericjuh

BLUB!

quote:
Op vrijdag 5 februari 2010 22:00 schreef Trollface. het volgende:

[..]

Werkt hier in FF/3.6.

3.5.7 heb ik hier btw.. voor de rest blokkeer ik geen javascript ofzo.

[edit]

Omg.. ik ben zo'n sukkel! lezen is moeilijk. Werkt inderdaad in FF. Vulde alleen mijn naam op de verkeerde plaatst in

Fail.

Dit keer zonder signature

vrijdag 5 februari 2010 @ 22:07:12 #5

Light

quote:
Op vrijdag 5 februari 2010 22:01 schreef Ericjuh het volgende:

Omg.. ik ben zo'n sukkel! lezen is moeilijk. Werkt inderdaad in FF. Vulde alleen mijn naam op de verkeerde plaatst in Fail.

Misschien moet je vragen of ze er een bril bij kunnen leveren

fokstok.nl

vrijdag 5 februari 2010 @ 22:07:49 #6

Chandler

quote:
Op vrijdag 5 februari 2010 21:47 schreef Chandler het volgende:
Weet iemand een tutoriaal of kant en klaar scriptje dat het volgende doet / kan.

Ik wil plaatjes uit een ajax gegenereerde div kunnen slepen naar een textarea en dan op de positie plaatsen waar ik de cursus op los laat, dus niet achteraan toevoegt..

Anyone?

The people who lost my respect will never get a capital letter for their name again.
Like trump...

vrijdag 5 februari 2010 @ 23:10:04 #7

ralfie

!Yvan eht nioj

quote:
Op vrijdag 5 februari 2010 22:07 schreef Chandler het volgende:

[..]

gebruik firefox of chrome, die doen dat automagisch al

zaterdag 6 februari 2010 @ 09:17:51 #8

Chandler

quote:
Op vrijdag 5 februari 2010 23:10 schreef ralfie het volgende:

[..]

gebruik firefox of chrome, die doen dat automagisch al

automagisch?

Eingelijk wil ik dat het plaatje dat naar de tekstarea getrokken wordt als code in de textarea verschijnt..

zo iets als dit dus:
http://ernestdelgado.com/articles/ddwdd/ maar dan ook werkend binnen IE

[ Bericht 15% gewijzigd door Chandler op 06-02-2010 10:05:51 ]

The people who lost my respect will never get a capital letter for their name again.
Like trump...

zondag 7 februari 2010 @ 21:37:35 #9

Chandler

Oplossing die ik graag wil delen:

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Sleep afbeelding in input text field</title>

<script type="text/javascript">

if(typeof window.ActiveXObject != 'undefined' && navigator.platform.indexOf('Win') != -1){

   document.ondragstart = function(){

      if(event.srcElement.nodeName == 'IMG'){
         event.dataTransfer.setData('TEXT', '[img]' + event.srcElement.getAttribute('src') + '[/img]');
      }
   }
}

</script>

</head>

<body>

<img src="http://www.cartoons.be/wp-content/garfield.gif" alt="een willekeurig plaatje" />

<form action="" method="post">
<textarea name="haha"></textarea>
</form>

</body>

</html>

bron: http://www.webmastercity.nl/forum/viewtopic.php?p=243032#243032

The people who lost my respect will never get a capital letter for their name again.
Like trump...

woensdag 10 februari 2010 @ 12:43:30 #10

DaFan

Ik heb de volgende variabele in JS gedefinieerd:

1 2	var Locatie = parent.location.href var LinknaarHuidigeOmgeving = Locatie.substring(Locatie.substr(0, 28) + Locatie.indexOf('/', 10) + 1, Locatie.indexOf('/', 31))

Deze wil ik combineren met:

1	document.writeln(LinknaarHuidigeOmgeving + '/docs/EPReports.asp')

Dat geeft me de juiste URL.
Maar hoe krijg ik deze in een <a href= DIE URL>
?

donderdag 11 februari 2010 @ 14:06:29 #11

DaFan

Opgelost

1	<a onclick="document.location.href = LinknaarHuidigeOmgeving + '/docs/EPHRDepOnlyMenu.asp'" onmouseover="this.style.cursor='hand'" title="Rapporten">Blaa</a>

woensdag 3 maart 2010 @ 16:40:10 #12

raav1

dut sub

ik heb een vraag om dat ik het nergens kan vinden ik heb echt gezocht.
en van de bovenstaande dingen woord ik niet veel weizer.

ik wil voor de lol en om te leren een html pagina maken waar in ik een web adres kan invullen d.m..v. "form"en deze dan op dezelfde pagina kan zien met "iframe"

ik ben met html zeer goed mar met javascript nog niet echt.

ik dacht iets als:

1
2
3
4
5
6
7
8
9
10

<form action="JAVASCRIPT NAAM1">
<input type="text" value="DOOR JAVA SCRIPT VERBORGEN DE TEXT : HTTP:// wat iemand in vult EN WEER DOOR JAVASCRIPT TEXT : .NL* ">
<buttom name=submit value=modify>
<script type="text/javascript" name="JAVASCRIPT NAAM1">
de code om de form dingen te doen
</script>
<script type="text/javascript" name="javascript code2">
de code om de input te kopieren naar javascript code3
</script>
<iframe src="JAVASCRIPT CODE3"></iframe>

HOOFDLETTER zijn dus dingen die ik niet weet enzo,

met een voorbeeld dat dit doet zal ik het ook snappen,
als iemand me kan helpen ben ik erg dankbaar.

Nee ik heb er geen zin in!

donderdag 4 maart 2010 @ 13:04:35 #13

Darkomen

Gewoon op de verkeerde termen gezocht.
2de hit op
"javascript iframe url navigation"

1
2
3
4
5

Deze code is alleen niet zo cross-platform.
Maar aangezien je 0.0% javascript ervaring hebt ga ik dat ook niet uitleggen.
Goed genoeg voor IE

maandag 8 maart 2010 @ 10:46:13 #14

Sitethief

Fulltime Flapdrol

1
2
3
4
5
6
7
8
9
10
11
12
13
14

indow.addEvent('domready', function() {
    window.addEvent('keydown', function(event){
        if($('float')) {
            if (event.key == 'l' && event.shift){
                if ($('float').hasClass('DivHidden')){
                  $('float').set('class', 'DivVisible')
                }
                else{
                  $('float').set('class', 'DivHidden')
                }
            }
        }
    })
});

Waarom werkt dit niet in IE8 maar wel in alle andere major browsers?

Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht >:)

maandag 8 maart 2010 @ 10:58:51 #15

Sitethief

Fulltime Flapdrol

Opgelost, IE pakt geen keydown op window (zie hier), dus heb ik em nu op document gezet.

Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht >:)

maandag 8 maart 2010 @ 16:40:43 #16

Darkomen

Hopelijk hebben jullie een idee,

Ik wil een window openen vanaf een pagina en deze moet na 2 seconden weer sluiten.
Maar, hier het probleem, de popup is een externe pagina welke ik niet kan aanpassen.

dinsdag 9 maart 2010 @ 21:28:56 #17

Gitaarmat

TVP

woensdag 10 maart 2010 @ 21:18:01 #18

Darkomen

Iemand nog een idee?

woensdag 10 maart 2010 @ 21:55:26 #19

Light

quote:
Op woensdag 10 maart 2010 21:18 schreef Darkomen het volgende:
Iemand nog een idee?

1 2	var popupWindow = window.open("my_autoclosing_window_url_goes_here"); setTimeout(2000, function() { popupWindow.close(); });

Er zijn vast nog wel verbeteringen mogelijk.

fokstok.nl

donderdag 11 maart 2010 @ 10:12:06 #20

Darkomen

Zo simpel, bedankt!

donderdag 11 maart 2010 @ 16:08:16 #21

Etimm

Ik heb een probleempje waar ik niet uitkom.
De oplossing is misschien heeeeel eenvoudig maar alles wat ik probeer loopt op niets uit. :(

Ik heb een tabel die bestaat uit 3 rijen. Als iemand op bijv: rij 1 klikt moet hiervan de achtergrond kleur veranderen. Als men vervolgens op bijv: rij 3 klikt moet hiervan de achtergrond kleur veranderen en de rij die een andere achtergrond kleur heeft gekregen (zoals rij 1 hierboven) weer terug naar de standaard achtergrond kleur.
Dit is te vergelijken met wat er gebeurt met een 'dropdownlist'.

Heeft iemand een idee hoe ik dit kan doen?

Hier de pagina en hieronder mijn code voor de tabel:

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

<HTML>
<HEAD>
<STYLE TYPE="text/css">

</STYLE>
<script type="text/javascript">
var url;
function insertdata(link) {
        url = link

}

function showdata(){
        return url;

}
</SCRIPT>
</HEAD>
<BODY>

<table width=590 border=0 style="padding:0px; border-collapse: collapse;">
<tr><td>MAAK EEN KEUZE</td></tr>

   <tr class="out"
    onclick="insertdata('een.html');"
   onmouseover="className='over'; this.style.cursor='hand';"
   onmouseout="className='out';">
   <td>een</td></tr>
   <tr class="out"
    onclick="insertdata('twee.html');"
   onmouseover="className='over'; this.style.cursor='hand';"
   onmouseout="className='out';">
   <td>twee</td></tr>
      <tr class="out"
    onclick="insertdata('drie.html');"
   onmouseover="className='over'; this.style.cursor='hand';"
   onmouseout="className='out';">
   <td>drie</td></tr>

</table>
<input type=button onClick="location.href=showdata();" value="Go >>">

</BODY>
</HTML>

donderdag 11 maart 2010 @ 17:40:32 #22

KomtTijd...

euh, onclick=this.parentNode.getElementsByTagName('tr').style.background='none';this.style.background='kleurtje'

Ik vraag me af waarom ik dit nog zeg ipv een linkje naar google te plaatsen...

zcflevo.nl

donderdag 11 maart 2010 @ 17:53:35 #23

Etimm

quote:
Op donderdag 11 maart 2010 17:40 schreef KomtTijd... het volgende:
euh, onclick=this.parentNode.getElementsByTagName('tr').style.background='none';this.style.background='kleurtje'

Ik vraag me af waarom ik dit nog zeg ipv een linkje naar google te plaatsen...

Ik heb het er in gezet en 'kleurtje' veranderd in 'red'. Helaas krijg ik een foutmelding dat

1	this.parentNode.getElementsByTagName('tr').style

leeg is.
Blijkbaar krijgt hij de waarde van tr niet mee :S

Als ik de volgende code gebruik werkt het zoals ik wil. Omdat er uiteindelijk nogal wat rijen komen is dit geen goede oplossing. Hoe kan ik hiervan een functie maken? Wat javascript betreft ben ik echt een "Dummie"

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

<html>
<head>
</head>
<body>

<table>

<tr id="1" onclick="this.style.backgroundColor='blue';
  document.getElementById('2').style.backgroundColor='white';
  document.getElementById('3').style.backgroundColor='white';"/>
<td>Click to change the color</td>
</tr>

<tr id="2" onclick="this.style.backgroundColor='blue';
  document.getElementById('1').style.backgroundColor='white';
  document.getElementById('3').style.backgroundColor='white';"/>
<td>Click to change the color</td>
</tr>

<tr id="3" onclick="this.style.backgroundColor='blue';
  document.getElementById('1').style.backgroundColor='white';
  document.getElementById('2').style.backgroundColor='white';"/>
<td>Click to change the color</td>
</tr>
</table>

</body>
</html>

[ Bericht 30% gewijzigd door Etimm op 11-03-2010 18:11:28 ]

donderdag 11 maart 2010 @ 18:13:05 #24

Darkomen

Doet moet je niet inline gaan doen.

Maak een functie die door alle tr's van je tabel loopt.
Geeft je tr's een id en bepaald daarop de kleur.

donderdag 11 maart 2010 @ 18:19:10 #25

KomtTijd...

quote:
Op donderdag 11 maart 2010 17:53 schreef Etimm het volgende:

[..]

Ik heb het er in gezet en 'kleurtje' veranderd in 'red'. Helaas krijg ik een foutmelding dat
[ code verwijderd ]

leeg is.
Blijkbaar krijgt hij de waarde van tr niet mee :S

Als ik de volgende code gebruik werkt het zoals ik wil. Omdat er uiteindelijk nogal wat rijen komen is dit geen goede oplossing. Hoe kan ik hiervan een functie maken? Wat javascript betreft ben ik echt een "Dummie"
[ code verwijderd ]

Ja stupid getElementsByTagName geeft natuurlijk een array terug. Toch maar even een for-loop maken dus.

zcflevo.nl

donderdag 11 maart 2010 @ 18:29:10 #26

Etimm

quote:
Op donderdag 11 maart 2010 18:19 schreef KomtTijd... het volgende:

[..]

Ja stupid getElementsByTagName geeft natuurlijk een array terug. Toch maar even een for-loop maken dus.

Hey, ik scheld jou toch ook niet uit?

Zo "natuurlijk" is javascript niet voor mij en dat de functie getElementsByTagName een array geeft wist ik niet.

Wat voor resultaat moet er ipv 'td' komen dan? Wat moet ik met de for-loop voor resultaat geven? td[1]?

donderdag 11 maart 2010 @ 18:30:59 #27

Etimm

quote:
Op donderdag 11 maart 2010 18:13 schreef Darkomen het volgende:
Doet moet je niet inline gaan doen.

Maak een functie die door alle tr's van je tabel loopt.
Geeft je tr's een id en bepaald daarop de kleur.

kun je me een voorbeeldje geven? kan ik de tr's een zelfde id geven?

donderdag 11 maart 2010 @ 18:35:58 #28

KomtTijd...

quote:
Op donderdag 11 maart 2010 18:30 schreef Etimm het volgende:

[..]

kun je me een voorbeeldje geven? kan ik de tr's een zelfde id geven?

http://w3schools.com/js/js_loop_for_in.asp alsjeblieft.
En nee.

En stupid van mezelf bedoelde ik

zcflevo.nl

donderdag 11 maart 2010 @ 21:22:12 #29

Etimm

Okeej, dat had ik niet door. Ik voel me nu ook ff stupid

Ik kon me vanmiddag echt niet meer concentreren dus ben ik zostraks maar wat anders gaan doen.
Gelukkig kreeg ik net weer inspiratie om overnieuw te beginnen. Ik ben wat verder maar niet alles werkt nog zoals ik dat wil:

Als ik op een regel klik dan stopt de mouseover. Helaas betekend dit gelijk dat deze ook stopt voor alle andere regels.

Hoe kan ik ervoor zorgen dat de mouseover alleen voor de geselecteerde regel stopt?

Hier is de nieuwe versie en hieronder de code:

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

<HTML>
<HEAD>
<SCRIPT type="text/javascript">
var status=false;
var wissel=false;

function ChangeStatus(selected)
{
   if (selected)
   {
      if (wissel)
      {
         status=false;
       wissel=false;
      }
      else
      {
         status=true;
       wissel=true;
      }
   }
}

function ChangeColor(tableRow, highLight)
{
   if (status)
   {
   }
   else
   {
      if (highLight)
      {
         tableRow.style.backgroundColor = '#3399ff';
      }
      else
      {
         tableRow.style.backgroundColor = 'white';
      }
   }
}

</SCRIPT>
</HEAD>
<BODY>

<table width=590 border=0 style="padding:0px; border-collapse: collapse;">
<tr><td>MAAK EEN KEUZE</td></tr>

   <tr onmouseover="ChangeColor(this, true);"
   onmouseout="ChangeColor(this, false);"
   onclick="ChangeColor(this, true); ChangeStatus(true);">
   <td>een</td></tr>

    <tr onmouseover="ChangeColor(this, true);"
   onmouseout="ChangeColor(this, false);"
   onclick="ChangeColor(this, true); ChangeStatus(true);">
   <td>twee</td></tr>

   <tr onmouseover="ChangeColor(this, true);"
   onmouseout="ChangeColor(this, false);"
   onclick="ChangeColor(this, true); ChangeStatus(true);">
   <td>drie</td></tr>

</table>
<input type=button onClick="location.href='#';" value="Go >>">

</BODY>
</HTML>

[ Bericht 46% gewijzigd door Etimm op 12-03-2010 09:10:34 ]

woensdag 24 maart 2010 @ 09:56:47 #30

Sitethief

Fulltime Flapdrol

Ik heb een hele serie li's die allemaal andere tekst bevatten, ik wil een CSS class toepassen op een li als hij een bepaalde waarde heeft, dus in feite: iif object has html do this with object .
Ik krijg het alleen niet voor elkaar in JS.....

Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht >:)

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

» digital corner

» development

» digital corner

» development