Vanilla JS是否等同于jQuery $.once()？

wnavrhmk 于 2023-03-29 发布在 jQuery

关注(0)|答案(2)|浏览(141)

在Drupal 9网站上工作，并尝试向页面添加一些自定义JS代码。

Drupal.behaviors.syfyGlobalHideMenu = {
  attach: function (context, settings) {
    $('.nav-flyout', context).once('remove-modals', function () {
      $(document).keyup(function (e) {
        if (e.keyCode == 27) {
          $('.nav-flyout', context).removeClass('js-flyout-active');
        }
      });
    });
  }
};

想知道是否有一个vanilla JS等效于上面的jQuery .once功能？目前Drupal多次附加事件侦听器，我试图避免这种情况，因为我只想附加一次事件侦听器，但每次调用事件时都保持附加并运行。

let intervalID = null;
const search = document.querySelector(".call-us-table input#edit-search");

search.addEventListener("keydown", event => {
  form.setAttribute("onsubmit", "return false");
  clearInterval(intervalID);
});
search.addEventListener("keyup", event => {
  intervalID = setInterval(submitForm, 2000);
});

jquery

来源：https://stackoverflow.com/questions/67271509/vanilla-js-equivalent-to-jquery-once

2条答案

按热度按时间

wgeznvg71#

Jquery一旦添加了一个html属性来检查是否是第一次运行。

function vanillaOnce() {
  if (!document.body.getAttribute('data-once')) {
    document.body.setAttribute('data-once', 'true');
    return true;
  } else {
    return false;
  }
}

if (vanillaOnce) {
  console.log('runs only once');
}

赞(0）回复(0）举报 2023-03-29

fhity93d2#

从9.2开始，Drupal就有了core/once库，就是为了这个目的。
要使用它，您需要向libraries.yml添加依赖项，如下所示：

my_search:
  version: 1.x
  js:
    js/my_search.js: {}
  dependencies:
    - core/drupal
    - core/once

然后在my_search.js中：

(function (Drupal, once) {
 Drupal.behaviors.my_search = {
   attach (context) {
     once('my_search', '.call-us-table input#edit-search', context).forEach((search) => {
       search.addEventListener('keydown', () => {
         ...
       });
       search.addEventListener('keyup', () => {
         ...
       });
     });
   }
 }
})(Drupal, once);

赞(0）回复(0）举报 2023-03-29

我来回答

Vanilla JS是否等同于jQuery $.once()？

2条答案

相关问题

热门标签

最新问答