首页 > 解决方案 > 未来元素的 jquery 选择器(如果可见)

问题描述

我的 ajax 弹出窗口之一加载得太晚了。所以我用 jquery 检查可见性的条件不起作用。

$(document).ready(function() {

    if($('#emailCart').is(':visible')){
        alert('yes');
        let shouldFire = true;
        $("input, select").click(function(){
         if(shouldFire) {
            alert('sent');
            sendGAEvent('Email', 'click','Email Cart');
            shouldFire = false;
           }
        });
    };
});

似乎“is(':visible')”只检查 dom 加载的元素。我怎样才能将这个条件也应用于未来的元素。

电子邮件购物车图片

电子邮件购物车图片

单击此电子邮件购物车按钮时,单击我的代码应该可以工作的任何一个文本框都会出现许多文本框。我正在使用一个工具 tempormonkey,通过它我将我的代码注入网站。但是当我使用 tempormonkey 注入时我的代码不起作用,而是使用控制台。

标签: javascriptjquerytampermonkey

解决方案


反过来做:检查处理函数中的可见性。

$(document).ready(function() {
  $("input, select").click(function() {
    if ($('#emailCart').is(':visible')) {
      alert('sent');
      sendGAEvent('Email', 'click', 'Email Cart');
    }
  });
});

如果inputselect元素是动态加载的,请使用事件委托,如在动态创建的元素上的事件绑定中所述?. 但这不会改变如何检查购物车可见性的逻辑。


推荐阅读