Ich möchte hier nichts Besonderes machen ... Ich möchte nur mit der Erfassung einiger Swipe-Ereignisse beginnen. Die ganze Dokumentation und Wiki und Blog Posts und Video Tutorials zeigen, dass es eine ziemlich unkomplizierte Aufgabe ist ... also warum habe ich so eine harte Zeit damit !!?jQuery Mobile Swipe-Ereignisse werden nicht ausgelöst ...
ich die richtigen Dateien bin Referenzierung ... andere Sachen funktioniert, damit ich weiß, dass sie nicht gebrochen Referenzen sind ...
<link rel="stylesheet" href="/libs/jQuery.mobile-1.4.5/jquery.mobile-1.4.5.min.css" />
<script type="text/javascript" src="/libs/jQuery/jquery-1.11.3.js"></script>
<script type="text/javascript" src="/libs/jQuery.mobile-1.4.5/jquery.mobile-1.4.5.min.js"></script>
Die HTML-EXTERNALLY geladen wird, ist aber ziemlich einfach ... Es ist eine ASP.NET WebForms-Seite, aber es gibt überhaupt keine serverseitige Aktivität. Es gibt nur den HTML-Code aus und wird auf der Seite korrekt angezeigt. Die meisten Zeilen sind nur jQuery-Attribute auf einigen "Seiten".
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<!-- BEGIN READING DATE -->
<div data-role="page" id="acctReadingDate" class="booth-acct-form"
data-title="Reading Date"
data-dom-cache="true"
data-theme="a"
data-next="#acctPrintCount"
data-url="acctReadingDate">
<div role="main" class="ui-content">
Reading Date<br />
</div>
</div>
<!-- END READING DATE -->
<!-- BEGIN READING DATE -->
<div data-role="page" id="acctPrintCount" class="booth-acct-form"
data-title="Print Count"
data-dom-cache="true"
data-theme="a"
data-prev="acctReadingDate"
data-next="#acctCash"
data-url="acctPrintCount">
<div role="main" class="ui-content">
Print Count
</div>
</div>
<!-- END READING DATE -->
<!-- BEGIN READING DATE -->
<div data-role="page" id="acctCash" class="booth-acct-form"
data-title="Cash"
data-dom-cache="true"
data-theme="a"
data-prev="#acctPrintCount"
data-next="#acctFree"
data-url="acctCash">
<div role="main" class="ui-content">
Cash
</div>
</div>
<!-- END READING DATE -->
<!-- BEGIN READING DATE -->
<div data-role="page" id="acctFree" class="booth-acct-form"
data-title="Free"
data-dom-cache="true"
data-theme="a"
data-prev="#acctCash"
data-next="#acctCredit"
data-url="acctFree">
<div role="main" class="ui-content">
Free
</div>
</div>
<!-- END READING DATE -->
<!-- BEGIN READING DATE -->
<div data-role="page" id="acctCredit" class="booth-acct-form"
data-title="Credit"
data-dom-cache="true"
data-theme="a"
data-prev="#acctFree"
data-next="#acctShotCount"
data-url="acctCredit">
<div role="main" class="ui-content">
Credit
</div>
</div>
<!-- END READING DATE -->
<!-- BEGIN SHOT COUNT -->
<div data-role="page" id="acctShotCount" class="booth-acct-form"
data-title="Shot Count"
data-dom-cache="true"
data-theme="a"
data-prev="#acctCredit"
data-next="nextForm"
data-url="acctShotCount">
<div role="main" class="ui-content">
ShotCount
</div>
</div>
<!-- END SHOT COUNT -->
</div>
</form>
</body>
</html>
Und die nicht so kompliziert Code, der feuern soll, wenn man mit dem Finger/Maus über den Bildschirm streicht ...
$(document).one("pagecreate", ".booth-acct-form", function() {
console.log("page created");
$(".ui-content").on("click", function (evt) {
console.log("clicked");
});
$(".ui-content").on("swipe", function (evt) {
console.log("swiped");
});
$(".ui-content").on("swipeleft", function (evt) {
console.log("Swiping left");
});
$(".ui-content").on("swiperight", function (evt) {
console.log("Swiping right");
});
});
Wenn die html die „Seite erstellt“ -Meldung geladen wird wird korrekt an das Konsolenfenster gesendet, sodass ich weiß, dass die Funktion zum richtigen Zeitpunkt ausgelöst und ausgelöst wird.
Ich habe die Swipe-Ereignisse an das unterste Element gebunden, um Probleme mit anderen Elementen zu vermeiden, die das Bubbling des Ereignisses aufheben (ich möchte es wirklich auf dem Dokument ... aber ... Debuggen). Ich habe ein Klickereignis hinzugefügt, um zu überprüfen, ob der Selektor korrekt ist und dass die Ereignisse es schaffen. Sie sind und die Klickmeldung wird ebenfalls korrekt ausgegeben.
Es ist nur die "Swipe" Ereignisse ... sie tun nichts. Sie sitzen einfach da und starren zurück, verspotten mich ... benehmen sich, als ob ich nicht "live", "bind", "on" und eine Million anderer Wege versucht hätte, sie an das Element zu binden, als ob die Hunderte von Selektoren ich Versuch ist nie passiert.
Ich kann es nicht mehr aushalten !! Diese Swipe-Events müssen behandelt werden !! Sie können nicht gewinnen!
bitte und danke: |
'.on (" pagecreate "," #pageId ", Funktion() {$ (". Ui-content ", das) .bla bla bla ....'. – Omar
Oder '.on (" pagecreate " , ".class", function() {$ (this) .find (".ui-content"). auf (bla bla bla ... '. – Omar
Ich habe das schon ausprobiert ... mit" on "statt" one "macht keinen Unterschied und die Verwendung von" one "ist das empfohlene Mittel, da die Bindung nur einmal statt einmal für jede Seite ausgeführt wird ... entsprechend dem Democode (http://demos.jquerymobile.com /1.4.5/swipe-page/#&ui-state=dialog) –