JQuery UI-Taste wird auf Refresh

deaktiviert ich darüber auf dem jquery Forum ohne Glück vor ein paar Wochen gefragt, so werde ich versuchen, wieder hier :)JQuery UI-Taste wird auf Refresh

Ich habe ein einfaches Widget für ein Projekt gemacht ich bin weiterarbeiten, aber ich habe ein seltsames Problem gefunden.

Es ist am einfachsten, es mit einer Beispielimplementierung zu erklären. http://decko.dk/buttontest

Auf der Seite gibt es 3 Schaltfläche. Der erste ist mein Drop-Down-Widget. Die nächste ist eine normale deaktivierte Taste (A) und die letzte eine reguläre aktivierte Taste (B). Wenn Sie dann die Seite aktualisieren (drücken Sie F5 oder was auch immer), ist die aktivierte Taste auf mysteriöse Weise jetzt deaktiviert. Ich habe keine Ahnung, warum das passiert, aber wenn Knopf A nicht deaktiviert ist, wird Knopf B beim Aktualisieren nicht deaktiviert. Außerdem, wenn ich den Aufruf von insertAfter in meinem Widget-Code entferne, wird die Schaltfläche nicht deaktiviert. Kann jemand herausfinden, warum dieses seltsame Verhalten auftritt?

Übrigens konnte ich das nur in Firefox reproduzieren.

Quelle

2010-04-27 Decko

Dank dafür zu fragen, Kumpel - I lief auf das gleiche Problem –

Ich fand diese Frage auf der Suche nach einer Lösung für ein verwandtes Problem, wo Chrome und FF würde nicht t eine deaktivierte jQuery UI-Schaltfläche als deaktiviert anzeigen (sie sah nur wie eine aktivierte Schaltfläche aus, nur dass Sie nicht darauf klicken konnten und Tooltips darauf nicht funktionierten), sie schien auf Opera nur wie erwartet zu funktionieren. Nach einigem Herumspielen war das "Problem", dass ich die "reguläre" jQuery '.attr ('deaktiviert', 'deaktiviert')' und '.removeAttr ('deaktiviert')' anstelle von jQuery UIs 'benutzte. button ('option', 'disabled', aBoolean) '. Sobald ich zu letzterem wechselte, funktionierte es über Browser hinweg. Hoffe das hilft jemandem. –

Ich glaube, das ist ein Fehler in wie Firefox erinnert Formularfeld/Kontrollwerte und Zustände:

Nach der ersten Seite zu laden, gibt es drei <button> Elemente im Dokument, und <button id="button_a"> ist deaktiviert. (Wenn die Schaltfläche "jQuery UI styled" aktiviert oder deaktiviert ist, wird das zugrunde liegende Element auf denselben Status gesetzt.)
Firefox merkt sich, dass die zweite <button> deaktiviert ist.
Nach einer Seitenaktualisierung stellt Firefox vor dem Ausführen von Skripts Formularfelder und Steuerelemente wieder her. Es deaktiviert die zweite <button>, aber da kein Skript ausgeführt wurde, ist die zweite Schaltfläche <button id="button_b">.
Wenn die jQuery UI die Schaltfläche "styled" für <button id="button_b"> erstellt, sieht sie, dass sie deaktiviert ist, und stylt sie weiterhin als deaktiviert.

Es gibt zwei Probleme hier:

Wie Firefox merkt sich, welche Elemente sind deaktiviert. Dynamische Elemente werden nicht berücksichtigt. Ich schlage dafür filing a bug with Mozilla vor.
Formularelemente bleiben nach einer Seitenaktualisierung deaktiviert. Ich bin nicht sicher, ob das das richtige Verhalten ist, aber es gibt zwei bugzilla reports auf diesem.

kann der Testfall nur vereinfachen unten dynamisch ein <button> Element hinzufügen und <button id="button_a"> deaktivieren, keine jQuery/jQuery UI notwendig:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
    <title>disabled button test</title> 
    <script type="text/javascript"> 
    window.onload = function() { 
     var a = document.getElementById('button_a'), 
      menu = document.createElement('button'); 
     menu.appendChild(document.createTextNode('Menu')); 
     document.body.insertBefore(menu, a); 
     a.disabled = true; 
    }; 
    </script> 
</head> 
<body> 
    <button id="button_a">A</button> 
    <button id="button_b">B</button> 
</body> 
</html>

Quelle

2010-04-27 09:52:38

Das war, was ich auch dachte, aber ich hoffte, dass es ein Jquery Bug war (da dies viel einfacher zu beheben wäre). Aber mit dem Code, den Sie zeigen, ist es absolut ein "Caching" Bug in Firefox. – Decko

Ich habe auch dieses Problem bekommen und arbeitete heraus, es war bis auf dumme Verhalten in firefox, war mein fix wie so:

vor:

//set up the buttons 
$("button").button();

nach:

//set up the buttons (and make sure firefox behaves) 
$("button").button().attr("autocomplete", "off");

Quelle

2010-10-15 22:45:55

Nicht sicher, was "Autocomplete" für einen Button tun soll - funktionierte nicht für mich. Ich habe '$ ('button'). RemoveAttr ('disabled'). Button();' stattdessen benutzt. – asgeo1

Es gab ein paar Versionen von Firefox, da sich dieses Verhalten möglicherweise geändert hat, aber die automatische Vervollständigung scheint die lästige Gewohnheit von Firefox zu verhindern, den Zustand der Steuerelemente zu speichern, wenn eine Seite aktualisiert wurde. –

Sie können einfach die 'automatische Vervollständigung = "deaktivieren" 'Attribut im HTML-Markup. – guzart

Einstellen der Expires HTTP-Header auf ein Datum in der Vergangenheit löste das Problem für mich in Firefox 6.0.

Quelle

2011-08-25 21:55:32

Hier ist die Lösung, die ich wirklich gut funktioniert in allen Browsern gefunden ...

ich jede Taste geben eine Klasse ‚js_submit‘ (das deaktiviert werden kann)

ich dann alle gesperrten Tasten wieder aktivieren mit der Klasse 'js_submit' im Seitenumbruch-Ereignis, das ausgelöst wird, wenn eine Seite entladen wird.

Ich wickle die Ereigniszuweisung in einen try-catch, um zu verhindern, dass Browser, die dieses Ereignis nicht unterstützen, einen Fehler auslösen (wie IE). Hier

ist der Code:

<input id="button" type="button" value="Submit" class="js_submit" /> 


// Fix for firefox bfcache: 
try { 
    window.addEventListener('pagehide', PageHideHandler, false); 
} catch (e) { } 

//Fires when a page is unloaded: 
function PageHideHandler() { 
    //re-enable disabled submit buttons: 
    $('.js_submit').attr('disabled', false); 
}

Quelle

2012-02-18 18:53:55

-2

In meinem Fall ist es eine Bootstrap-Fehler war

<input id="appointmentBtn" type="button" 
ng-click="addAppointment()" class="btn btn-primary btn-xs 
disabled" value="Add Appointment">

Stattdessen sollte es

gewesen

<input id="appointmentBtn" type="button" 
ng-click="addAppointment()" class="btn-primary btn-xs 
disabled" value="Add Appointment">

Quelle

2015-06-01 17:07:02 Gautam

Bitte füge das als Kommentar hinzu. – Abhi

JQuery UI-Taste wird auf Refresh

Antwort

Verwandte Themen