Exécuter une fonction contenue dans un autre fichier avec bouton

Résolu/Fermé
cocodu67... Messages postés 3162 Date d'inscription jeudi 28 janvier 2010 Statut Membre Dernière intervention 20 novembre 2024 - 26 janv. 2013 à 11:55
cocodu67... Messages postés 3162 Date d'inscription jeudi 28 janvier 2010 Statut Membre Dernière intervention 20 novembre 2024 - 3 mars 2013 à 19:27
Bonjour,

J'ai écris un code HTML que voici :

<html>
<head><title>Mise en Maj</title></head>
<body>


<h1>Conversion Minuscules en Majuscules</h1><hr>
<form name="formu"><table><tr><td>
Mot en minuscules :</td><td>
<input name="minuscules" type="text" size="10"></td></tr><tr><td>
Mot en majuscules :</td><td>
<input name="majuscules" type="text" size="10"></td></tr><tr>
<td colspan="2"><div align="center">
<input type="button" value="Transformer" onclick= JE NE SAIS PAS QUOI METTRE ICI il faut que ça utilise la fonction sur la page js.js> </td></tr>
</table></form>
</body>
</html>


Lors du clique sur le bouton "Transformer" je souhaite que ça exécute la fonction MiseMaj() contenu dans un autre fichier nommé js.js
Voici son contenu :

function MiseMaj()
{
//lire le mot en minuscules
var min=document.formu.minuscules.value;
//conversion en majuscules
var maj=toUpperCase(min);
//affichage du résultat
document.formu.majuscules.value=String(maj);
}


Voici la page sur laquelle se fait la conversion :
https://www.cjoint.com/c/CAAl0EFDa6G

Le problème c'est que qu'importe ce que je met après le onclick= il ne se passe rien lorsque je clique sur le bouton "Transformer.

Sauriez vous de ce que je devrais mettre ?
Pour info, on programme sur notepad++ et on lance simplement le code dans un navigateur, sans héberger sur un serveur.

Merci d'avance de votre aide :)
A voir également:

9 réponses

cocodu67... Messages postés 3162 Date d'inscription jeudi 28 janvier 2010 Statut Membre Dernière intervention 20 novembre 2024 145
Modifié par cocodu67... le 26/01/2013 à 18:35
UP

Le fichier js.js peut aussi être js.html peut importe tant que ça fonctionne.
0
georgesjeandenis Messages postés 23 Date d'inscription vendredi 6 juillet 2012 Statut Membre Dernière intervention 10 mars 2013 1
26 janv. 2013 à 21:21
C'est simple, tu n'a qu'a changer deux choses:

1- (change la ligne #13 de ton HTML)
<input type="button" value="Transformer" onclick="MiseMaj();" />

2- (change la ligne #6 de ton javascript)
var maj=min.toUpperCase();

La différence est à peine perceptible pour le numéro 2, mais c'est important.

Regarde ton script sur mon serveur fonctionne:

- http://osteohickson.com/a/misc/comment_ca_marche/1/mon_script.html (ton script modifié légèrement)
- http://osteohickson.com/a/misc/comment_ca_marche/1/ton_script.html (ton script original)

J'essaye toujours de garder le plus fidèlement le script original.
Il y a toujours plusieures façon de faire la même chose sur le web, cependant je favorise la simplicité.
0
georgesjeandenis Messages postés 23 Date d'inscription vendredi 6 juillet 2012 Statut Membre Dernière intervention 10 mars 2013 1
26 janv. 2013 à 21:26
Avant d'oublié,

IL me semble que cjoint.com transform ton fichier en image!
Si c'est le cas, ton script ne fonctionnera jamais...
0
cocodu67... Messages postés 3162 Date d'inscription jeudi 28 janvier 2010 Statut Membre Dernière intervention 20 novembre 2024 145
Modifié par cocodu67... le 26/01/2013 à 21:40
Merci d'avoir voulu m'aider mais ça ne fonctionne toujours pas.

Certainement car dans le HTML il n'est fait aucune référence au fichier js.js du coup le truc ne sait pas où chercher la fonction.

Et t'es bien certain que c'est <input type="button" value="Transformer" onclick="MiseMaj();" /> ? La fin me semble bizarre.

Finalement j'ai trouver tout seul en m'aidant de la modification que tu m'a dis de faire dans le html et le java et j'ai tout mis dans le fichier html :

<html>  
<head><title>Mise en Maj</title></head>  
<body>  
<script language="javascript">  
function MiseMaj()  
{  
//lire le mot en minuscules  
var min=document.formu.minuscules.value;  
//conversion en majuscules  
var maj=min.toUpperCase();  
//affichage du résultat  
document.formu.majuscules.value=String(maj);  
}  
</script>  
<h1>Conversion Minuscules en Majuscules</h1><hr>  
<form name="formu"><table><tr><td>  
Mot en minuscules :</td><td>  
<input name="minuscules" type="text" size="10"></td></tr><tr><td>  
Mot en majuscules :</td><td>  
<input name="majuscules" type="text" size="10"></td></tr><tr>  
<td colspan="2"><div align="center">  
<input type="button" value="Transformer" onclick= "MiseMaj();"> </td></tr>  
</table></form>  
</body>  
</html>


Bon c'est pas très lisible comme code mais pour un début c'est déjà bien.

J'aimerais quand même savoir si c'est possible d'exécuter des fonctions dans mon fichier .html lorsqu'elles se trouvent dans un autre fichier, très utile si j'ai une page avec 5 fonctions ou plus.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
georgesjeandenis Messages postés 23 Date d'inscription vendredi 6 juillet 2012 Statut Membre Dernière intervention 10 mars 2013 1
26 janv. 2013 à 21:56
"J'aimerais quand même savoir ..."

Oui, c'est facile regarde :

Garde ton nouveau code affiché dans ton dernier commentaire, exactement comme tu l'a écri puisqu'il fonctionne. Et sépare le en deux comme ce qui suit:

1- une partie javascript de la ligne 5 à 13 inclusivement :

function MiseMaj()
{
//lire le mot en minuscules
var min=document.formu.minuscules.value;
//conversion en majuscules
var maj=min.toUpperCase();
//affichage du résultat
document.formu.majuscules.value=String(maj);
}

2- une partie HTML (tout le reste) :

<html>
<head><title>Mise en Maj</title></head>
<body>
<script language="javascript">
</script>
<h1>Conversion Minuscules en Majuscules</h1><hr>
<form name="formu"><table><tr><td>
Mot en minuscules :</td><td>
<input name="minuscules" type="text" size="10"></td></tr><tr><td>
Mot en majuscules :</td><td>
<input name="majuscules" type="text" size="10"></td></tr><tr>
<td colspan="2"><div align="center">
<input type="button" value="Transformer" onclick= "MiseMaj();"> </td></tr>
</table></form>
</body>
</html>

3- Et apporte ce changement minuscule : (ligne 4 du HTML)
<script language="javascript" src="js.js">

4- N'oublie pas de sauvegarder la partie javascript sous le nom : js.js


Si tu garde le fichier HTML et le fichier js.js dans le même dossier, tu n'auras pas de problèmes.
0
georgesjeandenis Messages postés 23 Date d'inscription vendredi 6 juillet 2012 Statut Membre Dernière intervention 10 mars 2013 1
26 janv. 2013 à 22:01
Regarde, ce que je t'ai expliqué dans mon commentaire précédant fonctionne sur mon serveur:

http://osteohickson.com/a/misc/comment_ca_marche/2/html.html (pour tester)
http://osteohickson.com/a/misc/comment_ca_marche/2/ (pour télécharger les deux fichiers. Clique droit et fais soit Save Link As ... , Save Target As ... , Enregistrez la cible Sous..., Enregistrez le lien Sous... )
0
cocodu67... Messages postés 3162 Date d'inscription jeudi 28 janvier 2010 Statut Membre Dernière intervention 20 novembre 2024 145
26 janv. 2013 à 22:03
Cool ça marche :)

Mais c'est normal qu'à la ligne 4 j'ouvre le javascript
<script language="javascript" src="js.js">
et à la ligne 5 je le ferme
</script>
mais que ça fonctionne quand même lorsque je fais appel à la fonction MiseMaj à la ligne 13 du HTML ?

J'ai du mal à comprendre ça.
0
Exileur Messages postés 1475 Date d'inscription mercredi 31 août 2011 Statut Membre Dernière intervention 16 décembre 2022 150
3 mars 2013 à 19:26
Résolu ?
0
cocodu67... Messages postés 3162 Date d'inscription jeudi 28 janvier 2010 Statut Membre Dernière intervention 20 novembre 2024 145
3 mars 2013 à 19:27
Oui :)

J'ai oublié de le passer en résolu.

Je le fais de ce pas.
0