jquery onclick 无法处理来自 .load() 函数的元素

Question

我在一个单独的文件中有一个 PHP 片段，我正在使用 jquery 将其加载到一个 javascript 文件中：let signUpMode = $(".modal");  signUpMode.load("login_signup_popup.php");这是有效的，因为我能够在屏幕上显示它。但是，此代码段包含一个按钮，我想在加载该代码段的同一个 javascript 文件中单击该按钮。一些简单的东西，比如：$(".signupbtn").on("click", function(){    console.log("signed Up");  });但是，此单击不起作用。signupbtn是代码段中的 div 元素。不知何故，我错过了一个额外的步骤，因为 jquery 似乎无法识别代码段中的元素。

Answer 1

延迟加载的元素无法从已经初始化的事件处理程序中识别出来。所以你必须在父级上设置事件。这应该有效：

$(document).on('click', '.signupbtn', function(){ 

    console.log("signed Up");

});

Answer 2

https://api.jquery.com/load/

您可以使用完整功能来检查它是否已加载，或者您可以将按钮功能放在那里。

  let signUpMode = $(".modal");

  signUpMode.load("login_signup_popup.php", function() {

    $(".signupbtn").on("click", function() {

      console.log("signed Up");

    });

  });