Triggering a JavaScript Click() Event at Specific Coordinates

How to trigger a click event on specific x and y position of a div?

$(function() {
  $('.rating').on('page:click', function(e) {
  var coords = "X coords: " + e.clientX + ", Y coords: " + e.clientY,
  aim = document.elementFromPoint(e.clientX, e.clientY);
  $(aim).click();
  console.log(aim);
  $('#status').text(coords);
  });
  var action = $.Event('page:click', {clientX: 1043, clientY: 70});
  $('.rating').trigger(action);
});

How to simulate a click by using x,y coordinates in JavaScript?

You can dispatch a click event, though this is not the same as a real click. For instance, it can't be used to trick a cross-domain iframe document into thinking it was clicked.

All modern browsers support document.elementFromPoint and HTMLElement.prototype.click(), since at least IE 6, Firefox 5, any version of Chrome and probably any version of Safari you're likely to care about. It will even follow links and submit forms:

document.elementFromPoint(x, y).click();

• https://developer.mozilla.org/en-US/docs/Web/API/Document/elementFromPoint
• https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click

how to trigger a click event by specifying coordinate position(x,y) in react?

It's simulating a click at a position: x,y coordinates with javascript which can be achieved using this

document.elementFromPoint(x, y).click();

Is there a way to trigger a click event on a certain section?

You could check the id of the click-target before triggering the action, like so:

video = document.getElementById('video')

document.body.addEventListener('click', ({ target }) => {
  if (target.id === 'video') {
    video.style.display = "none";
    location.href ="#About";
  }
}, true);

Alternatively you could attach the click-handler on the element you care about and thereby avoid triggering the handler too often, like so:

document.getElementById('video').addEventListener('click', ({ currentTarget }) => {
  // `currentTarget` refers to the element the handler has been attached to
  currentTarget.style.display = "none";
  location.href ="#About";
}, true);

Google Maps V3 - Is it possible to trigger the on click event on a specific coordinate (lat, lng) programmatically

You can try passing additional arguments to trigger method:

var e = {
  latLng: new google.maps.LatLng(-35, 151)
};
google.maps.event.trigger(map, 'click', e);

Here is a working example showing infoWindow every time map is clicked (or on programmatic trigger): https://jsfiddle.net/beaver71/5ndjq8ge/

---

Related Topics