Javascript 将JS转换为多个实例的jQuery单击函数

我有一个Javascript函数，通过调用id运行一次。我尝试将该函数转换为jQuery，以允许该函数在pwd的每个实例中工作

我如何让jQuery代码像JS代码一样工作，但对pwd的每个实例都运行

var pwd=document.getElementById'pwd'； var eye=document.getElementById'eye'； 添加EventListener'click'，togglePass； 函数切换过程{ eye.classList.toggle'active'； pwd.type='password'？pwd.type='text'：pwd.type='password'； } .盒子{ 显示器：flex； 弯曲方向：立柱； 对齐项目：开始； } .通过{ 显示器：flex； 对齐项目：居中； 边框：1px实心； } .box输入[类型=文本]， .box输入[类型=密码]{ 显示：块； 保证金：20px自动； 背景：ececec； 边界：0； 边界半径：5px； 填充：14px 10px； 宽度：220px； 大纲：无； 颜色：565f79； } typcn先生{ 颜色：3b476b； 字体大小：22px； 光标：指针； } .cn.active{ 颜色：7f60eb； }

---

在单击事件中的jQuery版本上，您可以切换函数togglePass，但从未触发它。因为你在你的另一个版本

//用于触发您的功能 $.pass.onclick、.typcn-eye、togglePass； //在单击事件之外运行 函数切换过程{ //每次单击时切换活动类 $this.toggleClassactive； //获取prev元素的类型 让type=$this.prev.attrtype， 更改为=类型===密码？文本：密码； //更改该元素的类型attr $this.prev.attrtype，更改为； } .盒子{ 显示器：flex； 弯曲方向：立柱； 对齐项目：开始； } .通过{ 显示器：flex； 对齐项目：居中； 边框：1px实心； } .box输入[类型=文本]， .box输入[类型=密码]{ 显示：块； 保证金：20px自动； 背景：ececec； 边界：0； 边界半径：5px； 填充：14px 10px； 宽度：220px； 大纲：无； 颜色：565f79； } typcn先生{ 颜色：3b476b； 字体大小：22px； 光标：指针； } .cn.active{ 颜色：7f60eb； }

---

给你：工作。谢谢

$(".pass").on("click", ".typcn-eye", function() {
  var pwd = $(this).closest(".pwd");

  function togglePass() {
    $(this).toggleClass("active");

    pwd.type == "password" ? (pwd.type = "text") : (pwd.type = "password");
  }
});