onClick event is not working on Android Chrome

Question

I have this function and i call it with onClick. On Google Chrome (windows) is working but on the Android Chrome is not. How can i make it to work ontouch, in Android Chrome?

Thank you!

function copyCupon(cupon, link) {
  var copyText = document.createElement("input");
  document.body.appendChild(copyText);
  copyText.setAttribute("id", "copyTextId");
  copyText.setAttribute('value', cupon);
  copyText.select();
  document.execCommand("copy");
  document.body.removeChild(copyText);
  alert("Cuponul " + "'" + copyText.value + "'" + " a fost copiat. Spor la cumparaturi! :)");
  window.open(link);
}

<button onclick="copyCupon('test to copy', 'http://www.google.ro')">Copy coupon</button>

"How can i make it to work ontouch". Listen ontouch event. — dfsq
– dfsq, Commented Feb 7, 2018 at 10:31

Panos Kalatzantonakis · Accepted Answer · 2018-02-07 10:45:42Z

5

Try this:

Remove any hover rules or any CSS rules for the button and check if it works.
Add cursor pointer to the button style
Use jquery touchstart:

$('#whatever').on('touchstart click', function(){ /* your code */ });

edited Feb 7, 2018 at 10:45

answered Feb 7, 2018 at 10:38

Panos Kalatzantonakis

12.7k8 gold badges68 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Joe · Accepted Answer · 2021-02-01 10:43:29Z

2

Adding cursor: pointer; to the css does the trick for me, but can't offer any explanation why.

function do_something() {
alert('It works now!')
}

.button {
  cursor: pointer;
}

<button class='button' onclick='do_something()'>Click</button>

.button {
  cursor: pointer;
}

answered Feb 1, 2021 at 10:43

Joe

836 bronze badges

Comments

Aditya · Accepted Answer · 2018-02-07 10:42:37Z

Here's a fiddle using jQuery.

$('#btn').on('touchstart click', function() {
  var cupon = $('#btn').attr('val1');
  var link = $('#btn').attr('val2');
  var copyText = document.createElement("input");
  document.body.appendChild(copyText);
  copyText.setAttribute("id", "copyTextId");
  copyText.setAttribute('value', cupon);
  copyText.select();
  document.execCommand("copy");
  document.body.removeChild(copyText);
  alert("Cuponul " + "'" + copyText.value + "'" + " a fost copiat. Spor la cumparaturi! :)");
  window.open(link);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id='btn' val1='test to copy' val2='http://www.google.ro'>Copy coupon</button>

Collectives™ on Stack Overflow

onClick event is not working on Android Chrome

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related