fonction "Onchange" - problème de compatibilité selon le navigateur

**micsec** · 15/08/2018, 12h02

bonjour,
dans une page html, j'utilise la fonction "onchange" dans un formulaire pour appeler une autre page html.
Selon le navigateur utilisé, le résultat est correct ou non :
- Chrome :ok
- Firefox: non
IE : ok si j'autorise le contenu bloqué
Edge : ok si je débloque les fenêtres contextuelles
Opera : ok
sur iPad : ok avec Google, non avec Safari

Code:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE HTML>
<html>
<head>
<title> -- </title>
 
<script language="javascript">
function myChangeHandler()
{
window.open(this.options[this.selectedIndex].value);
this.form.submit();
}
</script>
</head>
 
<body>
<form id="myform1" >
<select onchange="myChangeHandler.apply(this)">
<option value=""> </option>
<OPTION VALUE="../albums/2012-03-18--10 ans Association/index.html">2012-03-18--10 ans Association</OPTION>
<OPTION VALUE="../albums/2009-06-19--AG/index.html">2009-06-19--AG</OPTION>
</SELECT>
</FORM>
</body>
 
</html>

Merci de votre aide

**tchize_** · 15/08/2018, 13h51

~~1) ici c'est java pas javascript~~
2) window.open peut être bloqué par le bloqueur de popup, il faut autoriser les popup.
3) tu dois tester la variable de retour

Envoyé par MDN

Comment savoir si ma fenêtre a été bloquée par un bloqueur de popups ?
Avec les bloqueurs de popups intégrés dans Mozilla/Firefox et Internet Explorer 6 SP2, il est possible de vérifier la valeur renvoyée par window.open() : elle sera null si la fenêtre n'a pas été autorisée à s'ouvrir. Cependant, pour la plupart des autres bloqueurs de popups, il n'existe pas de manière fiable.

4) window.open c'est juste une mauvaise idée depuis plus de 15 ans

Envoyé par MDN

Évitez de recourir à window.open()
De manière générale, il est préférable d'éviter d'utiliser window.open() pour plusieurs raisons :

5) pourquoi faire un select qui fait des window.open en fonction de la valeur sélectionnée plutot que de faire directement une lsite de liens

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<ul>
   <li><a href="../albums/2012-03-18--10 ans Association/index.html">2012-03-18--10 ans Association</a></li>
   <li><a href="../albums/2009-06-19--AG/index.html">2009-06-19--AG</a></li>
</ul>

**johnlobs** · 15/08/2018, 14h07

Bonjour,

Dans ta page xhtml il va falloir faire une detection d'objets et si cela echoue , détecter le navigateur.

Bon courage

**micsec** · 15/08/2018, 18h57

merci pour les réponses. Je ne suis pas assez compétent pour modifier le code et éviter "window.open".

il faut donc débloquer les fenêtres popup.

C'est vrai que la solution utilisant ul/li/href est bien plus simple et évite ce problème, mais je souhaitais utiliser le formulaire avec liste déroulante.

En fait, le code mentionné dans mon post est généré par un programme PHP. Extrait de ce code :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
       <form id="myform1" >
          <select onchange="myChangeHandler.apply(this)">
          <option value=""> </option>
<?php
foreach ($dir as $key => $val) {
?>
              <OPTION VALUE="<?php echo "../albums"; ?>/<?php echo $val; ?>/index.html"><?php echo $val; ?></OPTION>
<?php
}
?>
          </SELECT>
        <INPUT type="hidden" name="mdp" value="1" >
      </FORM>

Je mettrais une note sur ma page pour demander aux visiteurs de débloquer les popups, sinon j'utiliserai la méthode "ul/li/href" indiquée plus haut.

Merci encore

Invité · 16/08/2018, 13h05

Bonjour,

voici une solution fonctionnelle :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<form id="myform1" action="">
  <select onchange="submitBySelect(this, 'myform1');">
...

Code JavaScript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
function submitBySelect( sel, form_id ){
  var myform = document.getElementById( form_id );
  if( sel.value != '' )
  {
    myform.setAttribute('action', sel.value); // on met l URL dans action
    myform.submit(); // on soumet le formulaire
  }
}

(un exemple ici : liste déroulante sous le titre "Discographie")

**micsec** · 16/08/2018, 16h37

Ca marche
Merci beaucoup

fonction "Onchange" - problème de compatibilité selon le navigateur

JavaScript

Vue hybride

Discussions similaires

Partager

Partager