Firefox ne rafraîchissante balise select sur l'actualisation de la page

J'ai couru dans un problème où j'ai une balise select que l'utilisateur devrait l'utiliser pour sélectionner une marque de téléphone et la page à l'aide de jquery serait alors juste l'affichage de ces téléphones.

Grâce à l'aide de la population sur un débordement de pile maintenant cela fonctionne très bien sur tous les navigateurs, mais firefox. Pour une raison quelconque, quand j'actualise la page, la balise select montre la dernière option sélectionnée, mais la page montre tous les téléphones disponibles comme prévu. Quelqu'un aurait-il des suggestions ou des conseils sur l'obtention de firefox pour actualiser la balise select? Je ne peux pas l'afficher sur js.le violon parce qu'il ne se produise pas, il n'y voici donc le lien:

http://davidarabis.com/test/test.html

Et voici le code:

<select class="manufacturers">
    <option class="selected" value="all">All</option>
    <option value="motorola">Motorola</option>
    <option value="htc">HTC</option>
    <option value="lg">LG</option>
    <option value="samsung">Samsung</option>
    <option value="kyocera">Kyocera</option>
</select>

<div class="scroll-content">
    <ul class="manulist motorola">
        <li><a href="#">Motorola Triumph</a></li>
    </ul>
    <ul class="manulist htc">
        <li><a href="#">HTC WILDFIRE S</a></li>
    </ul>
    <ul class="manulist lg">
        <li><a href="#">LG Optimus Slider</a></li>
        <li><a href="#">LG Optimus V</a></li>
        <li><a href="#">LG Rumor Touch</a></li>
        <li><a href="#">LG Rumor 2</a></li>
        <li><a href="#">LG 101</a></li>
    </ul>
    <ul class="manulist samsung">
        <li><a href="#">Samsung Intercept</a></li>
        <li><a href="#">Samsung Restore</a></li>
        <li><a href="#">Samsung M575</a></li>
    </ul>
</div>

Le jquery:

$(document).ready(function() {

    $('.manufacturers').change(function() {
        var selected = $(this).find(':selected');
        $('ul.manulist').hide();
        if ($(this).val() == 'all') {
            $('.scroll-content ul').show();
        } else {
            $('.' + selected.val()).show();
            $('.optionvalue').html(selected.html()).attr(
                    'class', 'optionvalue ' + selected.val());
        }
    });
});

Merci d'avance pour toute aide ou de conseils.

il fonctionne très bien pour moi sur firefox. Effacer le cache de votre navigateur et de voir ce qui se passe

InformationsquelleAutor xoam | 2012-06-03

10

FireFox met en cache les valeurs d'un formulaire (y compris la valeur sélectionnée d'une select encadré), lorsque le mécanisme d'actualisation est activé normalement (F5). Toutefois, si un utilisateur choisit d'effectuer dur de rafraîchissement (Ctrl+F5), ces valeurs ne sera pas récupérée à partir de la mémoire cache et votre code fonctionne comme prévu.

Que les utilisateurs agissent sur leur propre volonté, vous devez fournir une solution pour couvrir les deux cas. Cela peut être fait par la prise de plusieurs approches:
- Poignée de chaque actualisation de la page: ajouter un peu de code pour définir la valeur par défaut de l'état sélectionné à l'intérieur de la window.onbeforeunload écouteur d'événement.
- Ajouter ce code au début de la DOM ready gestionnaire.
- Utiliser des cookies, comme décrit dans ce poste de Ted Pavlic blog, pour détecter l'actualisation de la page et d'agir sur elle (en plaçant le même code).
- Jeu de pas-en-têtes de cache sur le côté serveur, donc forcer les ressources pertinentes à être récupérée.
Références
Remarque: Il a été suggéré sur le liés de façon post, comme ici dans les commentaires, il suffit de tourner autocomplete off. Ceci, cependant, n'est pas la meilleure solution pour deux raisons: un. Compatibilité: autocomplete est un Attribut HTML5, nous sommes donc en limitant la mise en œuvre de notre choix, et b. Sémantique: L'objectif est de traiter le cas d'un rafraichissement de la page. Le autocomplete est prévu pour le contrôle de la session de l'histoire de la mise en cache et de gérer les invitant des contrôles de formulaire. Si cette mise en œuvre du changement dans l'avenir, que la solution sera de pause.
- Ou simplement l'utiliser autocomplete=off sur les contrôles pertinents.
- la saisie semi-automatique a été un non-attribut standard pour une longue période, afin de l'utiliser ne pas vous lier à HTML5.
- nous préférons, à se conformer aux normes, n'est-ce pas?
- Merci cela a fonctionné parfaitement. J'ai utilisé ce code jquery comme conseillé sur le deuxième lien et il a très bien fonctionné. $(window).décharger(function() { $('sélectionnez l'option').remove(); });
InformationsquelleAutor Eliran Malka

Je pense que j'ai une solution plus simple.
Pourquoi ne pas définir le sélectionner retour à l'index 0 lorsque le document est prêt?
Il pourrait ressembler à ceci:

$('.manufacturers').prop('selectedIndex',0);

De sorte que votre script pourrait ressembler à ceci:

$(document).ready(function() {

    $('.manufacturers').prop('selectedIndex',0);

    $('.manufacturers').change(function() {
        var selected = $(this).find(':selected');
        $('ul.manulist').hide();
        if ($(this).val() == 'all') {
            $('.scroll-content ul').show();
        } else {
            $('.' + selected.val()).show();
            $('.optionvalue').html(selected.html()).attr(
                    'class', 'optionvalue ' + selected.val());
        }
    });
});

Et après rechargement de la sélectionner sera de retour à la première position.

InformationsquelleAutor Kornel

3

Si votre balise select est à l'intérieur d'un formulaire, il vous suffit d'ajouter l'attribut autocomplete="off" et il va se comporter comme prévu.

InformationsquelleAutor user1809913

Vous devez vous connecter pour publier un commentaire.

Références