Vanilla JS - выполнение кода после нажатия на элемент - PullRequest
0 голосов
/ 20 апреля 2020

Можно ли вызвать функцию обратного вызова после нажатия на элемент с помощью myElement.click ()? Когда я оглядываюсь вокруг, все решения jQuery связаны или объединяются с addEventListener следующим образом:

myElement.addEventListener('click', function() {});

Я постараюсь объяснить мою ситуацию настолько хорошо, насколько это возможно, чтобы все было понятно

У меня есть сторонний плагин, который записывает значения 'lat' и 'lon' в текстовое поле, когда вы нажимаете его кнопку. Эта кнопка настолько безобразна, что я хочу заменить ее собственной стилизованной кнопкой.

Так что я сделал, скрыв эту стороннюю кнопку с CSS ('display: none'). Затем я создал новую кнопку «Перекрестие»:

  // Make a crosshairs button
  var crosshairs = document.createElement('i');
  crosshairs.id = 'crosshairs';
  crosshairs.className += 'Filter-crosshairs fas fa-crosshairs';
  crosshairs.title = 'Laad mijn huidige locatie';

Затем, для каждого появления этой кнопки третьей стороны, я поставил перед ней свою собственную созданную кнопку:

      for (var i = 0; i < currentLocationButtons.length; i++) {
        // Put my button before the (hidden) third party button
        var currentLocationButtonParent = currentLocationButtons[i].parentNode;
        currentLocationButtonParent.insertBefore(crosshairs, currentLocationButtons[i]);
...
      }

Теперь для каждой нажатой кнопки «Фильтр-перекрестие» этот щелчок следует передать этой скрытой кнопке. Это 'for' -l oop входит в предыдущий 'for' -l oop:

for (var i = 0; i < currentLocationButtons.length; i++) {
    currentLocationButtons[i].click();
}

Так вот моя проблема: я не могу сделать функцию обратного вызова, которая ждет, пока сторонний плагин установил значения 'lat' и 'lon' в текстовое поле. Если я go пишу код под 'click ()', я должен дважды нажать кнопку sh, чтобы она заработала (удобство для пользователя = ниже 0).

Кто-нибудь знает, как я могу это сделать? обратный звонок? Thx!

1 Ответ

1 голос
/ 20 апреля 2020

Итак, вот моя проблема: я не могу сделать функцию обратного вызова, которая ждет, пока сторонний плагин не установит значения 'lat' и 'lon' в текстовое поле.

Подумайте об использовании отложенного прослушивателя событий (аналогично JQuery s .on), например так:

document.addEventListener('click', function(event){
    // check some criteria that the target is the one you actually want
    if(event.target.className === 'someClass'){
        // do something here

    }
});

, так что прослушиватель событий присоединяется к документу и вам не нужен ваш фактический цель еще на странице.

nb. вы также можете вручную отправлять такие события, но YMMV, если вам нужна поддержка более старых IE (хотя для этого есть полифайлы):

yourElement.dispatchEvent(new Event('click'));
...