JQuery 对话框处理对话框内的事件答案

【问题标题】：JQuery dialog handling events within the dialogJQuery 对话框处理对话框内的事件
【发布时间】：2021-12-29 10:17:41
【问题描述】：

我有一个 JQuery 对话框让用户能够更改他们的密码。这一切都很好。我检查两个密码是否相同，并且新密码符合我的最低标准；并在按下“保存”按钮以在我的数据库中插入新密码时发送 Ajax 调用。

我想在输入密码时添加一个强度计，所以我需要一个“keyup”事件处理程序等，以便在输入每个字符时检查密码。看来，因为我要检查的输入在对话框内（这是动态创建的），所以我的脚本

$("#save_value").keyup(function(){
    console.log("keyup");   
});

没有“看到”元素#save_value，因为加载页面时它不存在。我尝试将它添加到基本页面，但我猜是因为它被覆盖了，即使使用相同的 id，它对上面的函数也是不可见的。我曾尝试将代码放在不同的地方但没有成功。我看不到如何将它添加到对话框功能中。

【问题讨论】：

【解决方案1】：

您要做的是使用event delegation。应该这样做：

$(document).on('keyup','#save_value',function(){

})

这就是动态元素的事件处理方式。

【讨论】：

【解决方案2】：

我自己找到了另一种方法

添加

document.getElementById("save_value").addEventListener("keyup", pwdMeter);

在调用 Dialog 小部件之后

【讨论】：