[JS] Script werkt wel goed in IE maar niet in FF - Softwareontwikkeling

dinsdag 3 januari 2006 23:50

Acties:

Topicstarter

hallo ik heb het volgende script:

code:

<html> 
  <head> 
    <script language="JavaScript" type="text/javascript"> 
    <!-- 
    var answerNumber = 2; 
    var answerField = ""; 
       function writeAnswerField() { 
          answerField = "<table><tr><td style=\"width:109px;\"> " + 
       answerNumber + ":</td><td style=\"width:300px;\"><input type=\"text\" name=\"Ant_" + 
       answerNumber + "\" class=\"form\"> <a href=\"javascript:writeAnswerField()\">Add</a></td></tr></table>"; 
          document.getElementById("pollAnswersLayer").innerHTML += answerField; 
          window.document.Toevoeg.hvl.value = answerNumber; 
          answerNumber++; 
       } 
    --> 
    </script> 
  </head> 
  <body> 
    <form name="Toevoeg"> 
      <input type="hidden" name="hvl" value=""> 
      <div id="pollAnswersLayer" style="position:absolute;"> 
        <table><tr> 
          <td style="width:109px;">1:</td> 
          <td style="width:300px;"><input type="text" name="Ant_1" class="form"> <a href="javascript:writeAnswerField()">Add</a></td> 
        </tr></table> 
      </div> 
    </form> 
  </body> 
</html>

Het script kun je hier vinden:
http://www.gratizwebtoolz.nl/script_test.html

In IE werkt het script goed als je iets invult bij 1 en dan op Add drukt dan wordt er een veld toegevoegd, maar in als je dat in FF doet dan wordt er wel een veld toegevoegd maar dan verdwijnd de inhoud die je bij 1 hebt ingevuld...

Weet iemand hoe dit komt?

alvast bedankt,

bartosiej

dinsdag 3 januari 2006 23:58

Acties:

crisp

Devver

Pixelated

Opera doet hetzelfde als Firefox en imho is dat correct behavior; je overschrijft namelijk de innerHTML waardoor die content opnieuw geparsed zal worden; form-elementen worden daardoor ook opnieuw geinitialiseerd.
Als je het netjes wilt doen dan zal je mbv dom-methods velden moeten toevoegen (createElement(), appendChild() e.d.)

Overigens horen javascript vragen in Webdesign & Graphics, dus ik verplaats deze even

Intentionally left blank

woensdag 4 januari 2006 00:00

Acties:

André

Analytics dude

Dat komt omdat je de complete inhoud van de pollAnswersLayer opnieuw in je document schrijft met innerHTML, FF doet het juist en zet de waarden van de velden weer gelijk aan die van het value attribuut.

Je moet eens zoeken op createElement en appendChild, dan kun je gewoon zonder zaken opnieuw te schrijven elementen toevoegen aan de DOM.

woensdag 4 januari 2006 00:01

Acties:

tombo_inc

uhuh

precies. je kan beter geen innerhtml meer gebruiken. het is het beste om te werken via het w3 DOM1. dan houd je je aan de "standaard" en die word op dit gebied toch wel door de belangrijkste browsers ondersteund. je zult dan idd oa moeten gaan kijken naar createElement() en appendChild().

Microsoft Windows: A thirty-two bit extension and graphical shell to a sixteen-bit patch to an eight-bit operating system originally coded for a four-bit microprocessor which was written by a two-bit company that can't stand one bit of competition

woensdag 4 januari 2006 00:16

Acties:

bartosiej

Topicstarter

oei en is dat erg moeilijk want ik snap bijna niks van javascript?

offtopic:
(geef mij maar PHP&HTML)

als het niet teveel werk is kan iemand dan het script ff fixen zodat het in IE werkt en in FF?

[ Voor 10% gewijzigd door bartosiej op 04-01-2006 00:17 ]

woensdag 4 januari 2006 00:26

Acties:

André

Analytics dude

Het is hier script-afhaal-chinees, we gaan dus niet een kant en klaar script voor je schrijven

woensdag 4 januari 2006 00:30

Acties:

bartosiej

Topicstarter

was ik al bang voor

maarja ik kan het altijd proberen toch

woensdag 4 januari 2006 13:59

Acties:

tombo_inc

uhuh

ik kan je wel even de goede richting in duwen

je maakt met de createElement() nieuwe html elementen aan. dus bijvoorbeeld voor een tabel.

JavaScript:

1	var tabel = document.createElement('table');

nu moet je alle elementen die je maakt op de juiste manier aan mekaar hangen. dat doe je met appendChild(). je wil bijvoorbeeld een tr in een table tag hebben.

JavaScript:

1
2
3

var tabel = document.createElement('table');
var tr    = document.createElement('tr');
tabel.appendChild(tr);

dit is het idee. de rest kun je zelf wel bedenken denk ik

Microsoft Windows: A thirty-two bit extension and graphical shell to a sixteen-bit patch to an eight-bit operating system originally coded for a four-bit microprocessor which was written by a two-bit company that can't stand one bit of competition

woensdag 4 januari 2006 16:58

Acties:

crisp

Devver

Pixelated

Tombo_inc: je kiest wel een lastig voorbeeld; bij tables moet je eigenlijk expliciet eerst een tbody of thead element aanmaken

Intentionally left blank