JAVASCRIPT: Non compatible Chrome

Fermé

JSneophyte Messages postés 3 Date d'inscription vendredi 6 janvier 2012 Statut Membre Dernière intervention 6 janvier 2012 - 6 janv. 2012 à 14:57
Reivax962 Messages postés 3672 Date d'inscription jeudi 16 juin 2005 Statut Membre Dernière intervention 11 février 2021 - 8 janv. 2012 à 18:04

Bonjour,

Bonjour,

Je suis grand, immense, indétronable débutant en Javascript.
J'ai un script simple qui fonctionne sous IE et Firefox mais Chrome ne veut rien savoir.
JavaScript est bien activé dans Chrome.
Je pense que je ne respecte pas un certain niveau syntaxique...
HELP ? Merci d'avance.

Script visible : http://www.wokus.fr/ocretest.php

<ital><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="javascript">
function changetest(img) {
if (img.src=='http://www.wokus.fr/_images20/icones/ok.png') { img.src = '_images20/icones/nok.png'; }
else { img.src = '_images20/icones/ok.png'; }
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<font color="#FFFFFF" size="4" face="Verdana, Arial, Helvetica, sans-serif"><span style="cursor: pointer;"><img id='essai' src="_images20/icones/ok.png" width="32" height="32" border="0" onclick="changetest(essai);"/></span></font>
</body>
</html></ital>

MERCI d'avance.

A voir également:

JAVASCRIPT: Non compatible Chrome
Telecharger javascript - Télécharger - Langages
Javascript est activé mais ne fonctionne pas ✓ - Forum Réseaux sociaux
Node.js javascript runtime virus ✓ - Forum Virus
Erreur #125 javascript - Forum Mozilla Firefox
A javascript error occurred in the main process - Forum Handicap / Accessibilté

2 réponses

Réponse 1 / 2

Reivax962 Messages postés 3672 Date d'inscription jeudi 16 juin 2005 Statut Membre Dernière intervention 11 février 2021 1 011
Modifié par Reivax962 le 6/01/2012 à 15:11

Bonjour,

À vrai dire, je suis plutôt surpris que IE et FF acceptent ton script :)
Dans la définition de ton image, tu mets :
<img id='essai' src="_images20/icones/ok.png" width="32" height="32" border="0" onclick="changetest(essai);" />

Le fait que l'id de ton image soit « essai » ne la définit pas pour autant comme une variable javascript du nom de « essai ». Donc ton changetest(essai) ne devrait pas pouvoir marcher.

À la place, deux solutions :
soit utiliser document.getElementById("essai"), qui pointe vers ton image ;
soit, plus simple, mais ne fonctionnant que parce que le onclick est défini dans la balise <img>, utiliser le mot-clef « this » :
changetest(this)

Du coup, ton <body> devient (le reste ne change pas) :

<body> 
    <font color="#FFFFFF" size="4" face="Verdana, Arial, Helvetica, sans-serif"> 
        <span style="cursor: pointer;"> 
            <img id='essai' src="_images20/icones/ok.png" width="32" height="32" border="0" onclick="changetest(this);"/> 
        </span> 
    </font> 
</body>

Xavier

(PS : ton empilement de <font><span><img> est tout-à-fait inutile, tu peux mettre tout ça sur la seule balise <img>. Ça devient alors :

<body> 
    <img style="cursor: pointer; color:white; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:4pt" id='essai' src="_images20/icones/ok.png" width="32" height="32" border="0" onclick="changetest(this);"/> 
</body>

JSneophyte Messages postés 3 Date d'inscription vendredi 6 janvier 2012 Statut Membre Dernière intervention 6 janvier 2012
6 janv. 2012 à 16:56

Oh yes, ça marche ^^
Merci beaucoup.

Réponse 2 / 2

JSneophyte Messages postés 3 Date d'inscription vendredi 6 janvier 2012 Statut Membre Dernière intervention 6 janvier 2012
6 janv. 2012 à 17:47

Ca marche niquel !

Je complexifie le sujet et donc j'ai testé avec document.GetElementbyID.
La encore je dois être faux en syntaxe.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="javascript">
function changetest(img, img2) {
imgid2=document.getElementById(img2);
if (img.src=='http://www.wokus.fr/_images20/icones/ok.png') {
img.src = '_images20/icones/nok.png';
imgid2.src = '_images20/icones/nok.png';
}
else {
img.src = '_images20/icones/ok.png';
imgid2.src = '_images20/icones/ok.png';
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<img style="cursor: pointer;" id='essai1' src="_images20/icones/ok.png" width="32" height="32" border="0" onclick="changetest(this, img2);"/>
<br />
<img style="cursor: pointer;" id='essai2' src="_images20/icones/ok.png" width="32" height="32" border="0" onclick="changetest(img, this);"/>
</body>
</html>

Reivax962 Messages postés 3672 Date d'inscription jeudi 16 juin 2005 Statut Membre Dernière intervention 11 février 2021 1 011
8 janv. 2012 à 18:04

En effet, ça ne peut pas marcher.
Je vais essayer d'expliquer.
Ta fonction changetest(img, img2) attend comme paramètres :
- img qui est un objet de type image (balise <img>). Tu l'utilises bien comme ça, puisque tu mets img.src=...
- img2 qui est un objet de type chaîne de caractère. Tu l'utilises dans la fonction document.getElementById(img2), donc c'est une chaîne de caractère qui doit être égale à l'id d'une image.

Or, dans tes appels à cette fonction, tu mets :
changetest(this, img2)
- this est OK : c'est l'objet <img> courant.
- img2 n'est, par contre, pas une chaîne de caractères. C'est une variable javascript indéfinie. Pour en faire une chaîne de caractères, il faut utiliser des guillemets : "img2" ou 'img2'

changetest(img, this)
- img n'est ni une chaîne de caractères, ni un objet de type image défini. C'est la même erreur que dans ton message d'origine.
- this est un objet de type image, alors que pour le deuxième argument de la fonction, on attend une chaîne de caractères.

Par ailleurs, tu mets comme id essai1 et essai2, alors que dans tes onclicks, tu mets du img et img2...

Je peux te proposer deux solutions.
1 -

function changetest(img1, img2)
{
    imgid1=document.getElementById(img1); 
    imgid2=document.getElementById(img2);

    if (imgid1.src == 'http://www.wokus.fr/_images20/icones/ok.png')
    {
        imgid1.src = '_images20/icones/nok.png';
        imgid2.src = '_images20/icones/nok.png';
    }
    else
    {
        imgid1.src = '_images20/icones/ok.png';
        imgid2.src = '_images20/icones/ok.png';
    }
} 

Pour les deux images :
onclick="changetest('essai1', 'essai2')"

2 -

function changetest(img1, img2)
{
    if (imgid1.src == 'http://www.wokus.fr/_images20/icones/ok.png')
    {
        imgid1.src = '_images20/icones/nok.png';
        imgid2.src = '_images20/icones/nok.png';
    }
    else
    {
        imgid1.src = '_images20/icones/ok.png';
        imgid2.src = '_images20/icones/ok.png';
    }
} 
......
onclick="changetest(this, document.getElementById('essai2'))"
onclick="changetest(document.getElementById('essai1'), this)"

Xavier

Discussions similaires

Javascript Arrondi à 2 chiffres après la virgule

java script error in the main process

javascript:void(0);

Faire un echo dans un script JS

afficher un tableau JS en HTML