Firefox ignore l'option selected= " selected"
si vous changez une liste déroulante et rafraîchissez la page, Firefox semble ignorer l'attribut sélectionné.
<option selected="selected" value="Test">Test</option>
il sélectionnera en fait l'option que vous aviez précédemment sélectionnée (avant le rafraîchissement). Cela finit par être un problème pour moi puisqu'il y a un événement déclenché sur le dropdown qui change d'autres choses. Y a-t-il un moyen de faire arrêter ce comportement par firefox (autre que de déclencher un autre événement lorsque la page se charge)?
20 réponses
AFAIK, ce comportement est codé en Firefox.
vous pouvez essayer de définir chaque élément de formulaire à son defaultValue
sur la charge de page.
ajouter autocomplete="off"
attribut HTML à chaque étiquette select. (source: https://stackoverflow.com/a/8258154/260080 )
cela corrige le comportement étrange dans FireFox.
dans firefox, j'ai remarqué que l'attribut" selected " ne fonctionnera pas à moins que vous ne positionniez le select dans un formulaire, où le formulaire a un attribut name.
vient D'avoir le même problème, croyez-moi il a été plus de 10 heures de lutte avec ce comportement stupide firefox, j'ai 7 chutes, chacun d'eux va déclencher un événement et remplir 24 entrées cachées, donc vous pouvez imaginer avoir la bonne option sélectionnée avec 24 valeurs d'entrée erronées!!! la solution que j'ai finalement trouvée est de réinitialiser le formulaire avec Javascript ajoutant cette ligne de code:
window.onload = function() { document.forms['MarkerForm'].reset(); };
PS: les entrées ont les valeurs extraites d'une base de données, le formulaire ne vide aucune valeur, mais d'une certaine manière, il dit à firefox de retourner à l'option selected=selected!
il est juste Firefox se souvenir de votre sélection précédente lors de rafraîchissement. Essayez un rafraîchissement dur à la place.
aussi, même numéro ici: https://stackoverflow.com/a/1505693/1069232
Voir aussi ici: https://bugzilla.mozilla.org/show_bug.cgi?id=274795
j'utilise FF 25.0.1
il ignore selected=""
et selected="selected"
.
Mais si j'essaie simplement selected
l'option est sélectionnée.
comportement étrange (non conforme). Je sais que selected
est valide HTML5 et c'est la forme la plus courte, mais j'écris habituellement du code qui valide aussi bien XML, de sorte que je peux utiliser n'importe quel outil de validation XML pour vérifier mes résultats d'une manière très stricte (et l'échange de données est très facile...)
selon W3C, ces variantes doivent être valides sur les attributs booléens:
HTML5: boolAttr="" | boolAttr="boolAttr" | boolAttr
XHTML5: boolAttr="" | boolAttr="boolAttr"
je préfère le premier, car il est presque aussi court que la dernière variante (non conforme xml), mais devrait être validé à la fois comme XHTML5 et HTML5. J'espère que Mozilla va arranger ça!
vous pouvez appeler .reset()
sur le formulaire avant de rafraîchir la page.
utiliser .prop() au lieu de .attr ()
This does not work in firefox.
$( 'option[value="myVal"]' ).attr( 'selected', 'selected' );
use this one
$( 'option[value="myVal"]' ).prop( 'selected', 'selected' );
In other way
$( this ).prop( 'selected', 'selected' );
le nom est mieux =>>
form id="UMForm" name="UMForm" class="form"
le select prendra l'attribut sélectionné
c'est peut-être un bug dans mozilla, mais essaie de donner un nom au dropdown.
joindre sélectionnez dans la forme de l'attribut et il va fonctionner.
<!-- will not work in firefox -->
<option selected="selected" value="Test">Test</option>
et
<!-- this will work in firefox -->
<form>
<option selected="selected" value="Test">Test</option>
</form>
autocomplete ne marchait pas pour moi non plus.
c'est le correctif javscript écrit en jquery que j'utilise:
$('input[type="radio"][selected]').click();
<option selected="selected" value="Test">Test</option>
dans ce cas cela a fonctionné à la fois pour Chrome et Firefox.
$('option[value="Test"]').prop('selected', true);
j'utilisais .attr()
au lieu de .prop()
pour afficher le premier élément de la liste déroulante, utilisez ProjectName.ClearSelection();
mettez des lignes dans votre page de conception pour travailler sur tous les navigateurs et aussi mettre ce sur le code derrière sur le chargement de page.
$(document).ready(function () {
$("#content_ProjectName option[value='1']").prop("selected", true);
});
si vous changez le select et rafraîchissez la page firefox va restaurer vos changements sur le formulaire, c'est pourquoi vous sentez que le select ne fonctionne pas. Au lieu de rafraîchir, essayez d'ouvrir le lien sur un nouvel onglet.
C'est ma solution:
var select = document.getElementById('my_select');
for(var i=0; i < select.options.length; i++){
select.options[i].selected = select.options[i].attributes.selected != undefined;
}
j'ai juste mis en haut de la page (id), et cela fonctionne pour moi. Remplacer le getElementById par une boucle sur toutes les sélections sur la page, je laisse comme exercice pour le lecteur;).
pour moi, aucune des solutions ci-dessus n'a fonctionné. J'ai dû définir explicitement la sélection si aucune n'était définie:
if (foo.find(':selected').length === 0) {
$(foo.find('option')[0]).attr('selected', 'selected');
}
je souhaite que firefox résoudre ce problème :(
au travail, je viens de corriger un bug où l'option select box s'affiche correctement dans Chrome mais pas dans Firefox, sur la même page web. Il s'est avéré être quelque chose de complètement différent que les problèmes ci-dessus, mais pourrait éventuellement être un problème que vous rencontrez.
en Chrome, la police de couleur de la boîte de sélection était noire. Pour une raison quelconque dans Firefox, la boîte de sélection hérité de la police-couleur du conteneur, qui était blanc. Une fois que j'ai ajouté une règle CSS pour forcer la sélection zone de police-couleur noire, la valeur définie est correctement affiché.
essayer de désactiver autocomplete
attribut de l'entrée select ... parfois le navigateur ignore select
à cause de cela
ni l'un ni l'autre autocomplete="off"
ou le placer à l'intérieur d'un form
fonctionne pour moi.
Ce travaillé a utiliser uniquement l'attribut sélectionné sans "valeur" comme ceci:
<option @(Model.Source == TermSource.Instagram ? "selected" : "")>
Instagram
</option>
<option @(Model.Source == TermSource.Facebook ? "selected" : "")>
Facebook
</option>
ainsi soit il rend <option selected>...</option>
, ou tout simplement <option>...</option>