begin process at 2012 05 29 16:27:01
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

CSS

 > 

Général

 > 

POPUP


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

POPUP

vendredi 25 février 2011 à 13:57:39 | POPUP

simvc


Bonjour,

Le code suivant me permet de voir quand la situation change sur mon Input 3,

mais je dois chaque fois activer cette page via son parent.

Comment faire en sorte que quand l'Input 3 change de valeur, je puisse avoir un pop up?

Merci,

<html>
<head>
<meta http-equiv="refresh" content="15">
<title>Avidiom Inputs</title>
</head>
<body>
<SCRIPT TYPE="text/javascript">
function ChangeImage(str){
if(str=='On')str='<img src="Green.jpg" NAME="StatusImage" border="0" width="100" height="100" alt="">';
else str='<img src="Red.jpg" NAME="StatusImage" border="0" width="100" height="100" alt="">';
return(str);
}

function ChangeText(str){
var re=/Off/;
str=str.replace(re,"Power Off");
re2=/On/;
str=str.replace(re2,"Power On");
return(str);
}

document.writeln(
'<table border="0" align="centre" cellspacing="14" summary="">'+
' <tr>'+
' <td>Input 1 %41</td>'+
' <td>Input 2 %42</td>'+
' <td><font color="#009900">Input 3</font> '+ChangeText('%43').bold()+'</td>'+
' <td>Input 4 %44</td>'+
' </tr>'+
' <tr>'+
' <td>Input 5 %45</td>'+
' <td>Input 6 %46</td>'+
' <td>Input 7 %47</td>'+
' <td>Input 8 %48</td>'+
' </tr>'+
' <tr>'+
' <td>Input 9 %49</td>'+
' <td>Input 10 %50</td>'+
' <td>Input 11 %51</td>'+
' <td>Input 12 %52</td>'+
' </tr>'+
' <tr>'+
' <td>Input 13 %53</td>'+
' <td>Input 14 %54</td>'+
' <td>Input 15 %55</td>'+
' <td>Input 16 %56</td>'+
' </tr>'+
'</table>'+ChangeImage('%43'));
</SCRIPT>
<form action="inputs.cgi" method="get">

</form>
</body>
</html>

Simvc
dimanche 27 février 2011 à 22:48:58 | Re : POPUP

007Julien


Telle qu'elles sont placées les fonctions changeText et changeImage ne sont appelées qu'une fois au chargement de la page lors de l'exécution du document.writeln !

Ensuite pour changer une image, il n'est pas nécessaire de modifier tout le code d'affichage mais seulement le nom et chemin du fichier correspondant src. Il convient toutefois de se méfier (voir l'alert(i.src) pour constater que le navigateur peut afficher un chemin relatif ou complet) et de faire un test si la chaine "Green.jpg" est contenue dans ce chemin.

Enfin les développeurs préfèrent les boucles à des écritures longues et laborieuses...

Voici, un script mettant en oeuvre ces principes. Pour la suite, il faudrait d'abord comprendre l'utilité de toutes ces cases et codes (%41 et suivants...) pour conseiller utilement.

Code HTML :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Untitled</title>
<style type="text/css">
body{font:12px/18px "Garamond";}
#pge{display:block;width:600px;margin 0 auto;}
</style>
</head>
<body>
<div id="pge"></div>
<p><a href="javascript:changeImage()">Changer l'image</a><br>
<img id="imgVar" src="Red.jpg" name="StatusImage" width="100" height="100" alt=""></p>
<script type="text/javascript">
// contruire le tableau dynamiquement
var tab='<table border="0" cellspacing="0" cellpadding="3">';
for (i=0;i<16;i++){
	if (i%4==0) tab+='<tr>'; // Si i est divisible par 4 nouvelle ligne
	tab+='<td>Case n°'+i+' <input id="ip'+i+'" value="%'+(41-(-i))+'"></td>';
	if (i%4==3) tab+='</tr>'; // Si le reste vaut 3 fin de ligne
	}
tab+='</table>';
alert(tab); // pour voir le code produit avant de l'insérer dans la page
document.getElementById('pge').innerHTML=tab;
function changeImage(){ // bascule sur Red.jpg et Green.jpg
	var i=document.getElementById('imgVar'); // récupére l'objet image du DOM
	alert(i.src)
	if (/Green\.jpg/.test(i.src)) {i.src="Red.jpg";i.alt="image rouge";}
	else {i.src="Green.jpg";i.alt="image verte";}
}
</script>
</body>
</html>




Cette discussion est classée dans : input, function, str, popup, change


Répondre à ce message

Sujets en rapport avec ce message

CSS: Change la couleur du texte d'un input [ par Mumuri ] Bonjour,j'aimerai changer le couleur de texte d'un input en mode disabled. Je pense que ca peut se faire via un css, mais je ne connais pas la ligne à modifier input autre fenetre [ par bob ] bonjour tout le monde, je vous explique ce que je veut, j'ai en faites une page qui ouvre un popup sur le popup, j'ai un champs texte et j'aimerai qu omment faire pour qu'une case de type input text change de couleur [ par rich25200 ] Bonjour, Je sais pas qi je suis dans le bon forum mais j'ai pas trouver de forum CSS ou autre, mais j'aimerai savoir comment faire pour qu'un chanp login [ par astuces_jeux ] Bonjour je cherche comment faire une page login qui vas vers un agenda que mes utilisateurs modifierontmerci de me dire comment faire une page login, Prblème de function [ par tepe ] BonjourJ'ai un problème avec une fonction externe.Dans mon ReFrame();popup(); Le problème, la fonction ReFrame f function case a cocher salon avec variable [ par snip74 ] bonjour a tous,voila sa fait des semaines que je recherche pour créer une fonction javascript pour obliger a cocher une case et limité a 3 case au max Demande d'explication sur la détection de l'événement onchange [ par snipeurcoq ] Bonjour, Je souhaiterais avoir un peu plus d'explication sur la détection de l'événement onchange. En fait dans mon application, je clique sur un bo ouverture popup conditionnel [ par jolilola64 ] Bonjour,je suis tout nouveau sur le forum et depuis 3 ans je developpe avec mes connaissances le site que nous avons.Aujourd'hui je dois mettre un pop Aide à la modification d'un script [ par kelsett ] Bonjour, J'ai téléchargé un script de popup en javascript, seulement j'aimerai le modifier afin qu'aulieu d'ouvrir une popup au clic sur un lien, il Uncaught Exeption (relation fenetre appelante/popup) [ par DDelec24 ] bonjour,Je souhaite, lorsqu'un utilisateur entre un mot dans un champ, qu'il puisse cliquer sur  un bouton de recherche qui ouvre un popup.De la jai v


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,234 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales