iOS Safari <Schaltfläche deaktiviert></button> nicht deaktiviert?

Question

Ich checkte ein Formular aus, das ich auf meinem iPad gemacht hatte und es scheint, dass das Hinzufügen von disabled zu einem <button> Tag die Schaltfläche nicht wirklich deaktiviert.

Hinzufügen disabled zu einem <input> Tag funktioniert aber nicht <button>.

So

<input type = "text" disabled />

funktioniert, aber

<button disabled>Hola</button>

nicht. Gedanken über Möglichkeiten, das zu beheben? Oder ist es nur ein Safari-Bug?

Answer 1

Sie können das disabled-Attribut auf einem <input />-Tag verwenden, aber kein <button />-Tag. Button wird offiziell nicht abgeschrieben, sondern weil Sie

<input type="submit" value="Click Me"> 

für Formularübermittlung Fähigkeiten und

<input type="button" value="Click Me"> 

für eine generische Ebene alte Taste tun kann, gibt es keinen wirklichen Punkt eine ganz andere Identifizierungskennzeichen. Darüber hinaus können Sie deaktivieren sowohl einen einreichen und eine regelmäßige Taste von disabled

<input type="submit" value="You can't Click Me" disabled> 
<input type="button" value="Click Me" disabled> 

Answer 2

Ich habe dies auf meinem Wohn-iPad überprüft. Du hast Recht, dass der button Tag nicht funktioniert, aber diese tun:

<input type="button" value="Go on, click me!"> 

und

<input type="submit" value="Go on, click me!"> 

Ich hoffe, dass Ihr Problem löst. Alles, was Sie mit einem <button></button> tun können, können Sie mit einem <input type="button"> oder <input type="submit"> tun. Es muss ein iOS Safari Bug sein.

EDIT:

Button tut disabled in Chrome übernehmen, so dass ich die Schuld Safari auf iOS.

EDIT:

Fiddle See.

Answer 3

Diese ISO Safari Bug Zugabe ist schrecklich. Unterstützt das iPad den Blink-Tag? Soweit ich weiß, können Sie wirklich nicht <input> 's wie <button>' s. Also, wenn Sie eine <button> mit <span> 's haben, die gestylt werden oder ' s in der button, <input> ist nicht der Weg zu gehen. Anstatt es zu fälschen, sollte sich der Button so verhalten, als hätte er das Attribut 'disabled'.

eine Klasse auf Ihre Schaltfläche Hinzufügen:

<button class='ipad-disabled'></button>

überprüfen, um dann festzustellen, ob die Taste, um diese Klasse von ‚ipad-disabled‘ hat, wenn es der Fall ist, geschieht nichts, wenn Sie auf diese Schaltfläche klicken:

$('button').on('click', function() { 
    if (!$(this).hasClass('ipad-disabled')) { 
     doSomething(this); 
    } 
}); 

Dann, wenn Sie benötigen die <button> das ipad-disabled "Klasse entfernen aktiviert werden:

$('button').removeClass('ipad-disabled');