cordova/phonegap onclick doesn't work

2019-02-26 08:51发布

I try to create button which starts an alert after a click event. Something like that :

    <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>

but the problem is that my onclick doesn't work. A lot of people tell me to try it on javascript so I've decided to write something like that :

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

alert("test2");

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

But this is the same thing.

Any ideas ?

7条回答
forever°为你锁心
2楼-- · 2019-02-26 09:02

Solution

// Function to change the content of t2

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

// add event listener to table

var el = document.getElementById("outside");
el.addEventListener("click", modifyText, false);
查看更多
家丑人穷心不美
3楼-- · 2019-02-26 09:02

You can try to do the following:

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

Then remove the onclick from your button tag and make sure that you included the jQuery library in your HTML o course.

If you want to use JavaScript only you should do :

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

<script> 
  function myFunction(){
   alert("clicked!");
  }
</script>
查看更多
冷血范
4楼-- · 2019-02-26 09:09

Here is a jQuery example

html

            <a href="#" class="start-button">EXECUTE</a>    

jquery

$(".start-button").click(function (e) {  //note that 'onclick="HandleExec();return false;" doesnt work
    e.preventDefault();
    // here you can handle the click code you wanted
});

make sure that you call event.preventDefault(); so it doesn't try to go to the href in the html tag. That will just reload the cordova app in this case.

查看更多
兄弟一词,经得起流年.
5楼-- · 2019-02-26 09:09

The solution is quite simple, actually. All elements, that you would like to have the click event working on, should have the CSS rule "cursor: pointer;"

You can find a working example here: https://haensel.pro/apache-cordova/apache-cordova-ios-click-event-not-working-quick-how-to

查看更多
Juvenile、少年°
6楼-- · 2019-02-26 09:10

Try adding jQuery click event, which are working fine with my cordova apps

<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>

Here is JSFiddle link

https://jsfiddle.net/9v85ku5y/

查看更多
7楼-- · 2019-02-26 09:16

Define a clickhandler that you can use later on:

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

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

This will trigger click on non-touch devices and touchstart on touch devices.

When that is said, I will strongly recommend using Fast click instead, and use regular click-events. With the above solution, you will trigger "touchstart" on links when you swipe on it to scroll the page for instance - which is not ideal.

查看更多
登录 后发表回答