script werkt niet in intenet explorer

Status
Niet open voor verdere reacties.
D

dj technics

Gebruiker
Lid geworden
1 sep 2007
Berichten
367
he,

ik heb een validatie script geschreven.
in firefox werkt alles goed maar in IE doet die echt niks.

hier is het script om te beginnen

HTML: 
<!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" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>validate</title>
</head>
<body>
    <form action="validate.html" method="post">
        naam: <input type="text" id="naam" onChange="validateNaam" /><img id="oknaam" src="ok.png" height="10px" width="15px">
        <br>e-mail: <input type="text" id="e-mail" /><img id="okemail" src="ok.png" height="10px" width="15px">
        <br><input type="submit" value="verzenden" id="submit" onChange="validateEmail" />
    </form>
    <script type="text/javascript">
    
        var naam = document.getElementById("naam");
        var email = document.getElementById('e-mail');
        var submit = document.getElementById('submit');
        var okNaam = document.getElementById('oknaam');
        var okEmail = document.getElementById('okemail');
        
        valueSubmitNaam = false;
        valueSubmitEmail = false;
        
        submit.style.opacity = 0;
        okNaam.style.opacity = 0;
        okEmail.style.opacity = 0;
        
        var validateNaam = function validateNaam(elem, cb){
            if ( document.addEventListener ){
                elem.addEventListener('keypress', cb, false);
            } else if ( document.attachEvent ){
                elem.attachEvent('onkeypress', cb);
            }
        }
        
        var validateEmail = function validateEmail(elem, cb){
            if ( document.addEventListener ){
                elem.addEventListener('keypress', cb, false);
            } else if ( document.attachEvent ){
                elem.atachEvent('onkeypress', cb);
            }
        }
        
        validateNaam(naam, function(){
            if ( naam.value.length > 4 && naam.value.length < 50 ){
                okNaam.style.opacity = 1;
                valueSubmitNaam = true;
            } else {
                okNaam.style.opacity = 0;
                valueSubmitNaam = false;
            }
        });
        
        validateEmail(email, function(){
            if ( email.value.length > 4 && naam.value.length < 50 ){
                okEmail.style.opacity = 1;
                valueSubmitEmail = true;
            } else {
                okEmail.style.opacity = 0;
                valueSubmitEmail = false;
            }
        });
        
        setInterval(function(){
            if ( valueSubmitNaam == true && valueSubmitEmail == true ){
                submit.style.opacity = 1;
            } else {
                submit.style.opacity = 0;
            }
        }, 2000);
        console.log(okEmail);
    </script>
</body>
</html>

ik zou echt niet weten hoe dit zou komen.

ik heb IE 6.0 en javascript is ingeschakeld (dit weet ik door het testen van andere scripts op die comuter).
mss kent die opacity niet?

zou iemand mij kunnen verder helpen???

bedankt

dj technics
 
opacity is niet in alle browsers hetzelfde.
Je kan misschien beter in een div zetten en dan de display op none zetten.
of misschien werkt het ook bij andere elementen.

[JS]
okEmail.style.display= none;

[/JS]

Gr,
Rick
 
IE6 kent inderdaad niet de opacity-eigenschap.
Maar iets heel anders: dit is vanwege het javascript een clientside validatie, met alle risico's van dien. Een "kwaadwillende" kan even javascript uitzetten, en dan allerlei gemanipuleerde ongein-code naar je server sturen. Dus absoluut niet veilig.

Een veilige formulier-validatie kan alleen serverside: daar kunnen kwaadwillenden niet bij. Ik zou op zoek gaan naar een php-validatie voor op je server!

Met vriendelijke groet,
CSShunter
 
csshunter zei:
IE6 kent inderdaad niet de opacity-eigenschap.
Maar iets heel anders: dit is vanwege het javascript een clientside validatie, met alle risico's van dien. Een "kwaadwillende" kan even javascript uitzetten, en dan allerlei gemanipuleerde ongein-code naar je server sturen. Dus absoluut niet veilig.

Een veilige formulier-validatie kan alleen serverside: daar kunnen kwaadwillenden niet bij. Ik zou op zoek gaan naar een php-validatie voor op je server!

Met vriendelijke groet,
CSShunter
Klik om te vergroten...

dit is een terechte opmerking.
ik ben net klaar met een cursus javascript en dit was eigenlijk de eerste functie die ik hellemaal zelf heb geschreven in de eerste plaats om mijn javascript kunsten eens uit te testen.

in de tweede plaats is het de bedoeling dat dit wordt ingebouwd op een site waar al een validatie op draait. het verschil is dat er daar met onSubmit met een alert wordt gewerkt maar dit vind ik beter en dit staat als eerste validatie maar uiteraard wordt dit nog eens gevalideert door php.

allen bedankt

ik ga dit onmiddelijk uitproberen

groet

djtechnics
 
uiteraard wordt dit nog eens gevalideerd door php
Klik om te vergroten...
Keurig, keurig: dat uiteraard moet iedereen maar van je overnemen! ;)

Over de css: zoals het nu is, staan de ok.png images en de submit-knop op eigen regels.
  • Als je daar dan {display:none;} c.q. {display: block;} op los laat, gaat het formulier verspringen. Bij {display:none;} verdwijnt namelijk het hele element, inclusief de ingenomen ruimte.
  • Dit kan je vermijden door de visibility-eigenschap te nemen: {visibility: hidden;} en {visibility: visible;}. Bij deze eigenschap blijft de ruimte wel gereserveerd, alleen het element wordt niet getoond.
  • Andere methode is om het element buiten bereik van het beeldscherm te schuiven: {margin-left: -9999px;} en {margin-left: 0;}. Ook dan blijft de hoogte bestaan.
En de ok.png'tjes kan je natuurlijk ook achteraan in de regels van de tekstvakjes zelf zetten, dat is misschien wel zo mooi. Dan maakt het niet uit welke verdwijntruc je toepast.

Met vriendelijke groet,
CSShunter
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan