[POO] Prototypes de fonctions et IE

[T.NightGlow]

Bonjour à tous,

Un petit problème se pose à moi : j'ai défini un jeu de fonctions prototypées sur la classe Object (mère de toutes les mères), et les appels fonctionnent très bien avec Firefox... mais voilà, niveau compatibilité avec IE, c'est la cata : "Cet objet ne gère pas cette propriété ou cette méthode".

Donc, voici un exemple de fonction :

Code :

1
2
3
4
5
6
7
8
Object.prototype.masque = function(){
  if(this.style&&this.style.visibility)
    this.style.visibility='hidden';
}
Object.prototype.affiche = function(){
  if(this.style&&this.style.visibility)
    this.style.visibility='visible';
}

Et un exemple d'appel :

Code :

1
2
3
<div id="mon_div" style="position:absolute;visibility:hidden">Test</div>
 
<a onmouseover="document.getElementById('mon_div').affiche();" onmouseout="document.getElementById('mon_div').masque();" >Afficher la bulle</a>

Il y a bien-sûr la solution de convertir ces fonctions d'Object en fonctions globales (affiche(mon_div)...), mais cela m'oblige à revoir tous les appels. J'ai une 10aine de fonctions comme ça, appelés une bonne centaine de fois... donc

Quelqu'un a une petite idée pour me dépanner ?

Merci d'avance,
T_NightGlow

[FremyCompany]

Sur IE, seul les objets javascripts héritent de Object...
Les objets venant du "serveur" ou navigateur ne sont pas des objets javascript

[T.NightGlow]

Oki...

Donc y'a moyen de prototyper mes méthodes sur un autre objet que "Object" ? Genre "HTMLElement" mais qui marcherait ? ("HTMLElement n'est pas défini" pour notre ami IE...)

Il n'empéche qu'un "alert(document.getElementById('mon_div'));" affiche un joli "[Object]" ? IE et les standards...

Ca m'embête surtout pasque ça marche nickel avec Firefox et que je dois quand même assurer la compatibilité de mon appli avec IE...

[NeHuS]

Je n'ai qu'une chose a dire :

Bienvenue dans le monde du dev Web

>> ie , ffx ... toute une histoire , meme si tu geres les recommandations du w3c tu peut etre sur d'avoir des merdes...

J'aimerais bien etre dans le futur quand tout sera standardisé !

[T.NightGlow]

MDR

En plus, je travaille sous Win2K Server, donc j'peux même pas me rabattre sur IE7 qui devrait être plus flexible...
Bref...

Pas de solution, vous pensez ?

[cetoto]

As tu trouvé une solution à ton probleme car je bloque aussi la dessus ?

Merci d'avance pour ta reponse.

[T.NightGlow]

J'ai pris le problème à l'envers, puisqu'il est insoluble avec IE :

- Etant donné le contexte du projet, je recommande à mes clients d'utiliser firefox ;
- J'ai créé une fonction "affiche(id)" et une "masque(id)" qui retrouve les objets par l'id et change la classe CSS pour passer d'un objet masqué à un objet affiché et inversement.

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function masque(mon_id){
  var mon_obj=document.getElementById(mon_id);
  if(mon_obj.className=='info_bulle_v')
    mon_obj.className='info_bulle';
  else if(mon_obj.style&&mon_obj.style.visibility)
    mon_obj.style.visibility='hidden';
}
function affiche(mon_id){
  var mon_obj=document.getElementById(mon_id);
  if(mon_obj.className=='info_bulle')
    mon_obj.className='info_bulle_v';
  else if(mon_obj.style&&mon_obj.style.visibility)
    mon_obj.style.visibility='visible';
}

Les fonctions sont pas complétement "sécurisées" contre les erreurs (objets introuvables etc...) mais je ne les appelle que quand je suis sûr qu'elles s'executeront

Pour sécuriser, tu peux rajouter :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function masque(mon_id){
  var mon_obj=document.getElementById(mon_id);
  if(mon_obj){
    if(mon_obj.className=='info_bulle_v')
      mon_obj.className='info_bulle';
    else if(mon_obj.style&&mon_obj.style.visibility)
      mon_obj.style.visibility='hidden';
  }
}
function affiche(mon_id){
  var mon_obj=document.getElementById(mon_id);
  if(mon_obj){
    if(mon_obj.className=='info_bulle')
      mon_obj.className='info_bulle_v';
    else if(mon_obj.style&&mon_obj.style.visibility)
      mon_obj.style.visibility='visible';
  }
}

N.B. : Si tu n'utilise pas de classes CSS, cela fonctionne aussi (mais il y aura des lignes superflues)

Les classes CSS (allégées) :

Code :

1
2
3
4
5
6
7
8
.info_bulle{
   visibility='visible';
   position='absolute';
}
.info_bulle_v{
   visibility='hidden';
   position='absolute';
}

[cetoto]

Merci pour ta reponse mais j'aimerai bien trouver une solution à ce probleme. Créer des function en passant l'object en paramettre c bien mais il serait preferable de pouvoir faire des prototypes.

[FremyCompany]

Envoyé par cetoto

Merci pour ta reponse mais j'aimerai bien trouver une solution à ce probleme. Créer des function en passant l'object en paramettre c bien mais il serait preferable de pouvoir faire des prototypes.

Ce serait préférable mais ce n'est pas possible...

Enfin si, c'est possible, mais faut faire du HTC...

CSS à ajouter :

Code :

1
2
3
* {
  behavior: url(addSomeFunction.htc);
}

Source du fichier HTC : [EDIT=this>>element]

Code :

1
2
3
4
5
6
7
8
9
10
11
12
<method name="show" />
<method name="hide" />
<script type="JScript"><!--
 
function show() {
  element.runtimeStyle.display="block";
}
 
function hide() {
  element.runtimeStyle.display="none";
}
--></script>

Attention, un élément ne dispose des méthodes show/hide que si il est DANS le document.

Code :

1
2
3
4
var e = document.createElement("e");
// Pas encore de méthode show/hide
document.body.appendChild(e);
// Méthode show/hide ajoutée

[cetoto]

Merci pour vos reponses.