Html code vraagje

[Ruben01]

Ik heb voor een bepaalde webpagina een applet gemaakt met Java. Deze applet werkt perfect wanner deze op een webpagina staat met tekst en afbeeldingen maar wanneer ik een buttons wil invoegen die doorlinken naar een andere pagina dan werkt de Java applet opeens niet meer. Als ik de buttons terug verwijder dan is alles opnieuw inorde.

Kan er mij iemand vertellen wat ik fout doe ?

[meijuh]

Post de code eens dan kunnen we het beter begrijpen. En welke browser gebruik je?

[Ruben01]

Post de code eens dan kunnen we het beter begrijpen. En welke browser gebruik je?

De code is een aantal A4'tjes lang dus ik weet niet of het wel zo goed is om dit te posten in de topic.

Als brwoser heb ik het uitgetest in FireFox en IE7.

Hieronder staat de code die ik gebruik voor 2 buttons, is het mogelijk dat deze de werking van een Javascript gaan blokkeren. Als ik dit stukje code verwijder dan werkt de applet opeens weer wel.

Als je de code van de applet wil bekijken dan kan ik ze mss wel doorsturen via PB maar als ik ze hier ga posten dan gaat het de topic erg onoverzichtelijk maken vrees ik.

Code: Selecteer alles

<div class="style7">

<a href="#"

onClick="parent.main.location=

'home.html';

parent.left_border.location=

'inhoud.html';

return false;"><img style="border: 0" id="img1" src="buttonA.jpg" height="20" width="90" alt="HOME" onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'buttonB.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img1',/*url*/'buttonA.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img1',/*url*/'buttonC.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img1',/*url*/'buttonB.jpg')" /></a>  

<a href="mailto:.........................">

<img style="border: 0" id="img2" src="button37.jpg" height="20" width="90" alt="CONTACT" onmouseover="FP_swapImg(1,0,/*id*/'img2',/*url*/'button38.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img2',/*url*/'button37.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img2',/*url*/'button39.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img2',/*url*/'button38.jpg')"><!-- MSComment="ibutton" fp-style="fp-btn: Embossed Tab 3; fp-bgcolor: #A6B3CB; fp-proportional: 0" fp-title="CONTACT" --></a></div>

[PdeJongh]

Hieronder staat de code die ik gebruik voor 2 buttons, is het mogelijk dat deze de werking van een Javascript gaan blokkeren. Als ik dit stukje code verwijder dan werkt de applet opeens weer wel.

Als je de code van de applet wil bekijken dan kan ik ze mss wel doorsturen via PB maar als ik ze hier ga posten dan gaat het de topic erg onoverzichtelijk maken vrees ik.

Dat valt wel op te lossen met de tags [ codebox ] en [ /codebox ] (zonder spaties uiteraard) Zie het voorbeeld met jouw code:

Code: Selecteer alles

<div class="style7">

<a href="#"

onClick="parent.main.location=

'home.html';

parent.left_border.location=

'inhoud.html';

return false;"><img style="border: 0" id="img1" src="buttonA.jpg" height="20" width="90" alt="HOME" onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'buttonB.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img1',/*url*/'buttonA.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img1',/*url*/'buttonC.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img1',/*url*/'buttonB.jpg')" /></a>  

<a href="mailto:.........................">

<img style="border: 0" id="img2" src="button37.jpg" height="20" width="90" alt="CONTACT" onmouseover="FP_swapImg(1,0,/*id*/'img2',/*url*/'button38.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img2',/*url*/'button37.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img2',/*url*/'button39.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img2',/*url*/'button38.jpg')"><!-- MSComment="ibutton" fp-style="fp-btn: Embossed Tab 3; fp-bgcolor: #A6B3CB; fp-proportional: 0" fp-title="CONTACT" --></a></div>

[meijuh]

heej ik herken dit.. ik gebruik swap image ook op mijn site. Het waren standaard ingebouwde functies van dreamweaver. Je mag ze wel van mij gebruiken. www.boshok.nl en dan gewoon kijke in de bron hoe ik ze heb gebruikt.

Wat je ook zou kunnen proberen is de buffer leeg te maken bij firefox (cntrl-shift-del) Dit heeft mij ook heel vaak geholpen met java script:)

[zpidermen]

Er staat duidelijk ergens een foutje in de code, want kijk maar naar de layout van wetenschapsforum:

html_code_vraagje 897 keer bekeken

Maar waar...? Ik heb net even gechecked maar alle tags worden keurig afgesloten. Maar ik zag ook iets met 'fp-style' en 'fp-bgcolor' e.d. Misschien dat je probleem te maken heeft met Frontpage-extentions?

Of misschien dat zaken als 'onMouseOver' hoofdlettergevoelig is?

[Ruben01]

Er staat duidelijk ergens een foutje in de code, want kijk maar naar de layout van wetenschapsforum:

Maar waar...? Ik heb net even gechecked maar alle tags worden keurig afgesloten. Maar ik zag ook iets met 'fp-style' en 'fp-bgcolor' e.d. Misschien dat je probleem te maken heeft met Frontpage-extentions?

Of misschien dat zaken als 'onMouseOver' hoofdlettergevoelig is?

De layout van wetenschapsforum heeft niet zoveel te maken met fouten in de code denk ik, de code is gewoon aangepast omdat het venster te smal is of niet ? Appart werken beide codes goed maar wanneer ik ze bij elkaar zet niet meer.

Dit is dan de code van het programma:

Code: Selecteer alles

<HEAD>

<style type="text/css">

<!--

select {

  font-family:verdana;

  font-size:10px;

  font-weight:normal;

}

input.script {

  font-family:verdana;

  font-size:10px;

  font-weight:normal;

}

table.script2 {

  font-size:11px;

  font-weight:bold;

}

.style1 {

font-family: Calibri;

font-size: medium;

}

-->

</style>

<script type="text/javascript">

ohmStr=String.fromCharCode(937);

base10=Math.log(10);

function preLoad(){

  

  arrCols=new Array();

  srcBase=document.getElementById('sel1');

  for(i=0;i<srcBase.length;i++){

arrCols[i]=srcBase.options[i].value;

  }

  arrImg=new Array();

  for(i=0;i<arrCols.length;i++){

for(j=0;j<3;j++){

  arrImg[i*3+j]=new Image();

  arrImg[i*3+j].src='band_'+arrCols[i]+(j+1).toString()+'.jpg';

}

  }

  pre1=new Image();

  pre1.src='band_d3.jpg';

  pre2=new Image();

  pre2.src='band_s3.jpg';

  pre3=new Image();

  pre3.src='band_mult_s.jpg';

}

function selCol(what,band){

  

  eval("document.getElementById('band"+band+"').src='band_"+what.value+band+".jpg';");

}

function selTol(){

  

  document.getElementById('mult').src='band_mult_'+document.getElementById('tolerance').value+'.jpg';

  document.getElementById('tolNum').selectedIndex=document.getElementById('tolerance').selectedIndex;

  calc();

}

function tolRev(){

  

  document.getElementById('tolerance').selectedIndex=document.getElementById('tolNum').selectedIndex;

  document.getElementById('mult').src='band_mult_'+document.getElementById('tolerance').value+'.jpg';

  calc();

}

function calc(){

  

  pow=document.getElementById('sel3').selectedIndex;

  if(pow==10)pow=-1; //gold

  if(pow==11)pow=-2; //silver

  

  res=Math.round((document.getElementById('sel1').selectedIndex*10+document.getElementById('sel2').selectedIndex)*Math.pow(10,pow+2))/100;

  if(res>990000){

document.getElementById('multSel').selectedIndex=2;

res/=1000000;

  }else if(res>990){

document.getElementById('multSel').selectedIndex=1;

res/=1000;

  }else{

document.getElementById('multSel').selectedIndex=0;

  }

  if(res>999){

res=res.toString();

res=res.substr(0,res.length-3)+','+res.substr(res.length-3,3);

  }

  tolOut=5*Math.pow(2,document.getElementById('tolerance').selectedIndex)

  document.getElementById('txtNum').value=res;

}

function calcRev(){

  

  document.getElementById('errSpan').innerHTML='';

  base=document.getElementById('txtNum').value;

  if(parseFloat(base).toString()=='NaN')return false;

  if(base==0)return false;

  multBy=Math.pow(1000,document.getElementById('multSel').selectedIndex);

  res=base*multBy;

  if((res>99000000000)||(res<.1)){

inputError();

return false;

  }

  raisedTo=Math.floor(Math.log(res)/base10);

  res=Math.round(res/Math.pow(10,raisedTo-1))/10;

  d1=Math.floor(res);

  d2=Math.round((res-d1)*10);

  if(d1==10){

d1=1;

d2=0;

raisedTo+=1;

  }

  mIndex=raisedTo-1;

  if(mIndex==-1)mIndex=10;

  if(mIndex==-2)mIndex=11;

  document.getElementById('sel1').selectedIndex=d1;

  selCol(document.getElementById('sel1'),1);

  document.getElementById('sel2').selectedIndex=d2;

  selCol(document.getElementById('sel2'),2);

  document.getElementById('sel3').selectedIndex=mIndex;

  selCol(document.getElementById('sel3'),3);

}

function inputError(){

  for(i=1;i<4;i++){

eval("document.getElementById('sel"+i+"').selectedIndex=0;");

eval("document.getElementById('band"+i+"').src='band_k"+i+".jpg';");

  }

  document.getElementById('errSpan').innerHTML="BUITEN BEREIK";

}

-->

</script>

</HEAD>

<BODY onload=' calc();preLoad()' style="background-color: #A6B3CB">

<p class="style1"> </p>

<p class="style1">De weerstandcalculator kan werken in 2 richtingen :<br>

        <br>

                                

1. Converteren van een kleurencode naar een weerstandswaarde met tolerantie.<br>

                                

2. Converteren van een weerstandswaarde met tolerantie naar een kleurencode.</p>

<table border=0 cellpadding=0 cellspacing=0 style="border:1px solid #000000;background-color:#ffffff;" align="center" class="script2">

<tr>

<td colspan=9 style="padding:3px;background-color:#000000;color:#ffffff;">weerstanden calculator	<span style='color:#ff0000' id=errSpan></span></td>

</tr>

<tr>

 <td colspan=9 align=center style="padding:5px;padding-bottom:20px;background-image:url(bkgTop.gif);">

<select id=sel1 size=1 onchange="selCol(this,1);calc();">

<option value=k>zwart</option>

<option value=n>bruin</option>

<option value=r>rood</option>

<option value=o>orangje</option>

<option value=y>geel</option>

<option value=g>groen</option>

<option value=b>blauw</option>

<option value=v>violet</option>

<option value=a>grijs</option>

<option value=w>wit</option>

</select>

<select id=sel2 size=1 onchange="selCol(this,2);calc();">

<option value=k>zwart</option>

<option value=n>bruin</option>

<option value=r>rood</option>

<option value=o>orangje</option>

<option value=y>geel</option>

<option value=g>groen</option>

<option value=b>blauw</option>

<option value=v>violet</option>

<option value=a>grijs</option>

<option value=w>wit</option>

</select>

<select id=sel3 size=1 onchange="selCol(this,3);calc();">

<option value=k>zwart</option>

<option value=n>bruin</option>

<option value=r>rood</option>

<option value=o>orangje</option>

<option value=y>geel</option>

<option value=g>groen</option>

<option value=b>blauw</option>

<option value=v>violet</option>

<option value=a>grijs</option>

<option value=w>wit</option>

<option value=d>goud</option>

<option value=s>zilver</option>

</select>

  

<select id=tolerance size=1 onchange="selTol()">

<option value=g>goud</option>

<option value=s>zilver</option>

<option value=n>geen</option>

</select>

</td>

</tr>

<tr>

 <td><img src="lead_l.jpg" width=101 height=68></td>

 <td style="background-image:url(band_k1.jpg)"><img id=band1 src="band_k1.jpg" width=16 height=68></td>

 <td><img src="fill_1.jpg" width=8 height=68></td>

 <td style="background-image:url(band_k2.jpg)"><img id=band2 src="band_k2.jpg" width=12 height=68></td>

 <td><img src="fill_2.jpg" width=11 height=68></td>

 <td style="background-image:url(band_k3.jpg)"><img id=band3 src="band_k3.jpg" width=12 height=68></td>

 <td><img src="fill_3.jpg" width=16 height=68></td>

 <td style="background-image:url(band_mult_n.jpg)"><img id=mult src="band_mult_g.jpg" width=10 height=68></td>

 <td><img src="lead_r.jpg" width=114 height=68></td>

</tr>

<tr>

 <td colspan=9 align=center style="padding-top:5px;padding-bottom:3px;">

<input type=text id=txtNum size=6 style="text-align:right" onkeyup='calcRev()'><select size=1 id=multSel onchange='calcRev()' class="script">

<option value=0><script>document.write(ohmStr)</script></option>

<option value=1>K<script>document.write(ohmStr)</script></option>

<option value=2>M<script>document.write(ohmStr)</script></option>

</select><select size=1 id=tolNum onchange='tolRev()'>

<option value=0>±5%</option>

<option value=1>±10%</option>

<option value=2>±20%</option>

</select>

 <br>

 </td>

</tr>

</table>

[Ger]

Er staat duidelijk ergens een foutje in de code, want kijk maar naar de layout van wetenschapsforum:

Da's een fout van IE6 die het principe van codeboxes niet begrijpt. Invision heeft de (discutabele) beslissing genomen om niet meer teveel rekening te houden met verouderde browsers als IE6 die al twee jaar geleden is vervangen door IE7 (waar het wel goed gaat volgens mij). Hoe dan ook, dat heeft niets met het probleem van Ruben te maken, want de code binnen codeblokken (wat Ruben postte) wordt niet verwerkt door de browser maar gewoon gelezen als platte tekst.

@Ruben: het is belangrijk dat je onderscheid maakt tussen Java en Javascript. Java is een programmeertaal, wordt door de server verwerkt en biedt gigantische mogelijkheden. Javascript is een scripttaal, wordt door de browser verwerkt en is alleen maar interessant voor "trucjes". Bij de eerste paar zinnen van dit topic had ik het al bijna verlaten omdat ik dacht dat het over java ging en ik daar gewoon geen kaas van heb gegeten.

Zie ook "javascript" op Wikipedia(nl) en "java" op Wikipedia(nl).

On topic: wat werkt er nu precies niet goed? Wat gebeurt er niet, of wat gebeurt er anders dan je bedoeld had?

[Ruben01]

On topic: wat werkt er nu precies niet goed? Wat gebeurt er niet, of wat gebeurt er anders dan je bedoeld had?

Wanneer ik de bovenstaande code opsla in een .html bestand en dit test in mijn browser dan werkt de code perfect zoals het zou moeten. Het is een stukje dat ik geschreven heb voor makkelijk de kleurencodes van een lineaire weerstand te achterhalen.

Wanneer ik in dit .html bestand buttons ga invoeren op deze manier:

Code: Selecteer alles

<div class="style7">

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<a href="#"

onClick="parent.main.location=

'home.html';

parent.left_border.location=

'inhoud.html';

return false;"><img style="border: 0" id="img1" src="buttonA.jpg" height="20" width="90" alt="HOME" onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'buttonB.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img1',/*url*/'buttonA.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img1',/*url*/'buttonC.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img1',/*url*/'buttonB.jpg')" /></a>&nbsp;&nbsp;

<a href="mailto:example@example.com?subject=Website IR-apparaat">

<img style="border: 0" id="img2" src="button37.jpg" height="20" width="90" alt="CONTACT" onmouseover="FP_swapImg(1,0,/*id*/'img2',/*url*/'button38.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img2',/*url*/'button37.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img2',/*url*/'button39.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img2',/*url*/'button38.jpg')"><!-- MSComment="ibutton" fp-style="fp-btn: Embossed Tab 3; fp-bgcolor: #A6B3CB; fp-proportional: 0" fp-title="CONTACT" --></a></div>

<hr>

Dan werkt het de code voor de weerstand calculator niet meer. De keuzelijsten waar je de kleuren kan kiezen zijn dan opeens precies niet meer gekoppeld aan de afbeeldingen van de kleurringen.

Als ik die code van de buttons terug verwijder dan is alles terig perfect.

De button code gaat de het javascript precies verstoren. Kan dat ?

[Ger]

De button code gaat de het javascript precies verstoren. Kan dat ?

Dat herken ik alleen van IE (6&7), die heeft nog wel eens problemen met JS. Maar jij zegt dat het ook in FF fout gaat...

Ik weet het zo ff niet eerlijk gezegd. Een manier om uit te zoeken waar het verkeerd zit, is codebrokje voor codebrokje het spul in commentaar zetten, steeds testen en dan zie je op een gegeven moment waar het probleem zich voordoet. Vervolgens kun je dan gaan googlen op browsercompatibiliteit van dat stukje code. Want als er een taal is die door elke browser anders gelezen wordt, dan is het wel JS.

PS: ik heb trouwens even je mailadres in de code vervangen door een exampleadres (example.com is daarvoor speciaal in het leven geroepen) en je codes in codeboxen gezet:

Code: Selecteer alles

[code]jadajadajada

[/code]

[Ruben01]

Ik denk dat het vorige keer niet werkt omdat er een codetag niet afgesloten was. Nu werkt het wel in FireFox maar nog steeds niet in IE.

Is hier een oplossing voor te vinden zodat beiden werken.

PS: ik heb trouwens even je mailadres in de code vervangen door een exampleadres (example.com is daarvoor speciaal in het leven geroepen) en je codes in codeboxen gezet:

Code: Selecteer alles

[code]jadajadajada

[/code]

Bedankt hiervoor.

[Ger]

Weet je al om welk stukje code het gaat? Dan kunnen we gericht gaan zoeken. De beste manier is dan googelen naar

browsercompatibiliteit <commando> IE

of

browsercompatibility <commando> internet explorer

Want heel eerlijk: ik ken echt niet alle JS commando's.

[Ruben01]

Als ik het goed begrijp dan moet ik elk stukje code invoegen in google en checken of dat compatibel is met IE.

Indien je zo de bug moet achterhalen dan moet men maar werken met FireFox voor het gebruik van de calculator.

Ik dacht dat het misschien anders kan opgelost worden omdat beide codes appart perfect werken en samengevoegd blijken ze nu enkel te werken in FF. Blijkbaar kan dit niet zomaar opgelost worden dus dan wordt het FF'en.

[Ger]

Nja, wat ik bedoelde was meer gebruik maken van de commentaarfunctie:

Kijk, je code is opgebouwd uit delen. Bijvoorbeeld aan het begin:

[html]<script type="text/javascript">

ohmStr=String.fromCharCode(937);

base10=Math.log(10);

function preLoad(){

arrCols=new Array();

srcBase=document.getElementById('sel1');

for(i=0;i<srcBase.length;i++){

arrCols=srcBase.options.value;

}[/html]

Zet dat eerste stukje tussen commentaar-tekens:

[html]<script type="text/javascript">

ohmStr=String.fromCharCode(937);

base10=Math.log(10);

function preLoad(){

/*arrCols=new Array();

srcBase=document.getElementById('sel1');

for(i=0;i<srcBase.length;i++){

arrCols=srcBase.options.value;

}*/[/html]Op die manier negeert de browser dat stuk tussen /* en */. Test het dan nog eens. Gaat het mis? Dan haal je het commentaar daar weer weg, en ga je naar het volgende stuk. Op een gegeven moment moet je dan tegenkomen waar het mis gaat. Dat stukje ga je vervolgens analyseren. Google is daarbij een hulpmiddel, maar je kunt het natuurlijk ook hier plaatsen, misschien gaat er bij iemand wel ineens een lichtje branden. Je elimineert iig een hoop. In plaats van zoeken naar een speld in een hooiberg, hoef je dan alleen nog maar dat beetje hooi te onderzoeken dat aan je riek hangt.

Het lijkt me sowieso beter om niet zomaar te zeggen: "IE zuigt, ze moeten maar FF gebruiken". [hide]ook al zuigt IE inderdaad, maar dat terzijde [/hide] Je kunt gewoon niet om IE heen en soms, héél soms, gaat het ook wel eens mis bij FF of bij Opera. En je kunt moeilijk zeggen van "pagina A t/m D zijn te bekijken in IE, pagina E t/m H in FF en voor pagina I t/m P wordt Opera aanbevolen". Je moet gewoon zorgen dat al je pagina's fatsoenlijk weergegeven worden in het gros van de gangbare browsers. Soms betekent dat dat je na het bouwen van de basis nog eens zo lang bezig bent om het goed werkend te krijgen in alle browsers, maar dat proces maakt van jou wel een betere webdesigner, want in het vervolg weet je hoe je bepaalde problemen kunt omzeilen.

Ik ben overigens hartgrondig van mening dat browsercompatibiliteit een drama is. Maar dat terzijde.

[Ruben01]

Het lijkt me sowieso beter om niet zomaar te zeggen: "IE zuigt, ze moeten maar FF gebruiken".

Verborgen inhoud

ook al zuigt IE inderdaad, maar dat terzijde

Daar sluit ik mij bij aan .

Bedankt voor de bovenstaande tips, ik ga kijken of ik de fout zo kan opsporen.