2016-04-24 3 views
2

Ich versuche eine Schaltfläche zu erstellen, die nach einem Klickereignis eine Warnung auslöst. Etwas wie das:cordova/phonegap onclick funktioniert nicht

<body> 
    <div class="app"> 
     <h1>Apache Cordova</h1> 
     <div id="deviceready" class="blink"> 
      <p class="event listening">Connecting to Device</p> 
      <p class="event received">Device is Ready</p> 

     </div> 
     <button onclick="alert('salut')" id="boutonAlerte">Alerte</button> 
    </div> 
    <script type="text/javascript" src="cordova.js"></script> 
    <script type="text/javascript" src="js/index.js"></script> </body> 

aber das Problem ist, dass mein onclick nicht funktioniert. Viele Leute sagen mir, es auf Javascript, um zu versuchen, damit ich so etwas entschieden haben, zu schreiben:

function onAlertClick() { 
    alert("ceci est une alerte"); 
} 

alert("test2"); 

var bA = document.getElementById("boutonAlerte"); 
bA.addEventListener("onclick", onAlertClick()); 

Aber dies ist das gleiche.

Irgendwelche Ideen?

+0

Haben Sie [dies] versucht (http: // stackoverflow.com/a/16777521/1513547) –

+0

Nein, weil ich nicht JQuerry verwenden, aber warum nicht, ich denke, Jquerry könnte eine gute Lösung sein –

+0

funktioniert nicht mit Touchend und JQuerry. Kann wegen der jQuerry-Version sein? (Ich habe das letzte, 2.2.3) –

Antwort

2

Versuchen Hinzufügen von jQuery Click-Ereignis, das mit meiner cordova apps fein arbeiten

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.3.js"></script> 

<script type="text/javascript"> 
    $("#boutonAlerte").click(function(){ 
     alert("ceci est une alerte"); 
    }); 
</script> 

Hier JSFiddle Link

https://jsfiddle.net/9v85ku5y/

+0

ok danke, ich denke, ich werde auch jquery in meine App setzen –

+0

Ich habe jQuery src mit dem neuesten aktualisiert, also schaut bitte nach –

+0

Es funktioniert nicht mit der letzten jq-Version wenn ich '$ (" # boutonAlerte "benutze)) .on ("touchend", function() {alert ("angeklickt");}); ' –

1

onclick wird nicht auf cordova apps gefeuert, weil Benutzer nicht "klicken", sondern "tippen". Sie können ein anständiges mobiles Framework wie Ionic verwenden und verwenden, es löst automatisch das Problem für Sie, weil es ngTouch enthält.

Wenn Sie kein großes Framework wie eckig verwenden möchten, können Sie Zepto.js verwenden und $(".element").on('tap', callback); verwenden, um auf Tap-Ereignisse zu warten. Oder $(".element").on('tap click', callback);, um sowohl auf Tippen als auch auf Klickereignisse zu hören.

Chrome-Dev-Tools haben eine gute mobile Emulation, um Tippereignisse auszulösen. Es kann hilfreich sein, wenn Sie Ihre App in Chrome debuggen möchten.

0

einen clickhandler definieren, die Sie später verwenden können:

var clickHandler = ('ontouchstart' in document.documentElement ? "touchstart" : "click"); 

$("a").bind(clickHandler, function(e) { 
    alert("clicked or tapped. This button used: " + clickHandler); 
}); 

Dies löst klicken Sie auf Nicht-Touch-Geräten und Berührungsstart auf Touch-Geräten.

Wenn das gesagt wird, empfehle ich dringend, stattdessen Fast Click zu verwenden und normale Click-Events zu verwenden. Mit der obigen Lösung werden Sie "Touchstart" auf Links auslösen, wenn Sie darauf wischen, um zum Beispiel die Seite zu scrollen - was nicht ideal ist.

+0

Danke für Ihre Antwort. Ich werde es heute Abend versuchen. Ist es JQuerry? –

0

Sie können versuchen, die folgendes zu tun:

$("#boutonAlerte").on('click', function(){ 
alert("Clicked!"); 
}); 

Dann entfernen Sie die onclick aus Ihr Button-Tag und stellen Sie sicher, dass Sie die jQuery-Bibliothek in Ihrem HTML-Kurs enthalten.

Wenn Sie nur tun, sollten Sie JavaScript verwenden möchten:

<button onclick="myFunction();" id="boutonAlerte">Alerte</button> 

<script> 
    function myFunction(){ 
    alert("clicked!"); 
    } 
</script> 
1

Lösung

// Funktion den Inhalt t2 Tabelle

function modifyText() { 
    var t2 = document.getElementById("t2"); 
    if (t2.firstChild.nodeValue == "three") { 
    t2.firstChild.nodeValue = "two"; 
    } else { 
    t2.firstChild.nodeValue = "three"; 
    } 
} 

// hinzufügen Ereignis-Listener zu ändern

var el = document.getElementById("outside"); 
el.addEventListener("click", modifyText, false);