如何从html元素中添加或删除类会影响附加到这些元素的onclick和其他类似功能？

我有一些简单的代码。我正在使用Jquery。我有两个元素分配给他们一个特定的类。其中一人也被分配到b1。如何从html元素中添加或删除类会影响附加到这些元素的onclick和其他类似功能？

b1类有一个onclick属性附加到它。

现在我放置一个按钮，点击时试图从所有元素中删除类b1。但即使如此，我仍然看到点击功能仍然有效。

有人能解释一下吗？我有我的代码jsfiddle

我观察到只有CSS属性被添加。绑定到这些元素的JavaScript事件不会到位。

<body> 
    <table> 
     <tr> 
      <td class="a b1" id="cell1">Cell 1</td> 
      <td class="a b2" id="cell2">Cell 2</td> 
     </tr> 
    </table> <a href="#" id="click1">Remove B1 </a> 
    <br/> 
</body> 

<script> 
    $(document).ready(function() { 

    $(".b1").click(function() { 

      alert("B1"); 

     }); 

     $("#click1").click(function() { 
      alert("removed b1"); 

      $(".a").removeClass('b1'); 
       alert("removed b1 from all elements. "); 

    //even after executing this statment - the onclick still remains active. 

     }); 
    }); 
</script>

来源

2013-03-24 geeky_monster

$(".b1")返回元件和.click()附加的事件处理程序的元件本身。选择器不是“动态”的。什么你要找的是事件委派：

$('table').on('click', '.b1', function() { 
    ... 
});

这附加的事件处理程序table元素，它反过来又委托给该选择匹配的子元素。

来源

2013-03-24 08:05:19 Blender

谢谢！如果我想删除点击功能，这个工作吗？ $（'table'）。off（'click'，'.b1'）; – 2013-03-24 08:26:27

@ mad.geek：试试吧。我认为会的。 – Blender 2013-03-24 08:27:44

很酷。谢了哥们！！ – 2013-03-24 08:28:16

你安装的onclick事件处理程序选择器匹配的元素。选择器只是抓取元素的集合，然后将它应用到它们，你不能将一个事件处理程序应用到一个类。

你可以这样做，只在类存在时才运行处理程序。

$(".b1").click(function() { 
    if ($(this).hasClass('b1')) { 
     alert("B1"); 
    } 
});

来源

2013-03-24 08:04:26

感谢队友的答案！ – 2013-03-24 08:33:07

JavaScript在这个实例中的工作原理是一旦文档准备就绪，它就会将侦听器添加到适当的DOM对象中。（因此，在这种情况下，它会将点击侦听器添加到文档已完成加载加载点的所有具有类b1 的标签）。即使您在文档加载完成后更改类，侦听器仍会查找原始标记。

为了使功能只在当前选择的元素来运行，尝试on()功能

来源

2013-03-24 08:11:39

感谢队友的描述性答案！ – 2013-03-24 08:33:28

如何从html元素中添加或删除类会影响附加到这些元素的onclick和其他类似功能？

回答

相关问题