jquery mobile error - kann Methoden vor der Initialisierung nicht auf Schaltfläche aufrufen; versucht, die Methode 'disabled' aufzurufen

Question

Laut der Dokumentation (http://jquerymobile.com/demos/1.2.0/docs/api/events.html) sollte das paginit-Ereignis aufgerufen werden, nachdem alle Widgets und Plugins für eine jQuery mobile-Seite ausgeführt wurden. Also, ich glaube, ich sollte in der Lage sein, mit Elementen auf dieser Seite ungestraft im Ereignisrückruf zu interagieren. Aber ich höre für die Seite zu initialisieren und dann versuchen, mit einem Knopf auf der Seite zu interagieren, und ich erhalte die folgenden Fehler:

cannot call methods on button prior to initialization; attempted to call method 'disabled'

Ich habe zusammen eine codepen setzen, um zu zeigen Ihnen:

http://codepen.io/mattsnider/pen/mvcbD

Was gibt? Funktioniert die Seite nicht wie dokumentiert oder ist das ein Fehler?

Answer 1

Es ist nichts falsch mit Ihrem pageinit Ereignis. Das falsche liegt in dem <a> Tag.

Um den Fehler zu entfernen, Sie bekommen, werden Sie zwei Änderungen an Ihrem Code vornehmen müssen:

1. Sein nicht disabled, seine disable
2. vor Ihrem Anruf die disable Methode, müssen Sie Rufen Sie button() Methode. Somit hätten Sie das Element button initialisiert.

Dies ist, wie der Code wie jetzt aussehen:

$('#ageNext').button().button('disable'); 

Aber, wenn Sie dies tun, werden Sie eine Fehlermeldung wie folgt erhalten:

Uncaught TypeError: Cannot call method 'addClass' of undefined

Der Täter liegt in dem Code, der die disable Methode

disable: function() { 
    this.element.attr("disabled", true); 
    this.button.addClass("ui-disabled").attr("aria-disabled", true); 
    //^^ Uncaught TypeError: Cannot call method 'addClass' of undefined  
    return this._setOption("disabled", true); 
} 

aufruft

Sie sehen die this.button dort? Dies wird undefined, wenn das Element keine echte Schaltfläche ist.

Also, ich habe die disable, nur auf input[type=button] und <button/> Art von Elementen zu arbeiten. Aus irgendeinem Grund funktioniert dies nicht wie erwartet auf <a/> imitieren von Schaltflächen. Ich habe dies manuell zu arbeiten, habe ui-disabled Klasse auf das Element hinzufügen, wie folgt aus:

$(document).on('pageinit', '#age', function (e) { 
    $('#ageNext').addClass('ui-disabled'); 
}); 

Demo: http://jsfiddle.net/hungerpain/gzAHT/

Answer 2

Dies kann auch passieren, wenn Sie nicht angepasste HTML-Tags haben, besonders beunruhigend ist </div> ohne ein zuvor erklärt <div>.

Das erste, was zu überprüfen, könnte sein, dass Ihr HTML gut gebildet ist.