Question

我试图在wordpress中单击带有jquery的类。这是我的代码

import $ from 'jquery';

class Scroller {
    constructor() {
        this.events();
    }
    events() {
        alert("hi");
        $(".load-more").on("click", this.test_func.bind(this));
    }

    test_func() {
        alert("yo");
    }
}

当我运行此代码时，将显示hi警报，但是当我单击.load-时，什么也没发生。

我知道设置了jquery是因为当我运行此js文件（针对相同的类）时，它可以工作：

jQuery(document).ready(function ($) {

    $(document).on('click', '.load-more:not(.loading)', function () {

Answer 1

也许您尝试添加处理程序时未呈现输入。尝试使用此语法为您添加test_func点击处理程序：

$(document).on('click','.load-more', this.test_func.bind(this));

如果您的元素是动态添加的，则以上是由于事件委托将处理程序正确添加到click事件的唯一方法。了解更多here。

Answer 2

那是因为您告诉jQuery将所需事件附加到所有当前现有数据中。换句话说-如果在声明事件后创建了.load-more元素，则jQuery不会将所需的事件附加到所需的选择器。

您可以选择2种选择：

1. 创建该元素，然后像在第一个示例中指定的那样添加事件。
1. 使用$(document).on('click', '.load-more:not(.loading)', callback)。

你知道为什么这个点击的jQuery不起作用吗？

2 个答案: