在点击按钮应用事件只为它的祖先

我最近学习JS/jQuery和我需要帮助应用一个特定的风格/类的顶部div单击其中的按钮，但问题是，HTML具有不同的部分，祖先上具有相同的按钮和相同的类，并且我想要仅将应用于包含触发按钮的实际div。在点击按钮应用事件只为它的祖先

HTML：

<div class="class"> 
    <div> 
     <div> 
      <button data-action="action"> 

<div class="class"> 
    <div> 
     <div> 
      <button data-action="action">

SCRIPT：

$('[data-action="action"]').click(function() { 
    $(".class").addclass("new-class") 
})

有了这个代码明显new-class被激活的按钮应用到所有现有class类无论。

谢谢！

来源

2017-06-12 David de la O

尝试'$（本）.closest（ “类 ”）。addclass（“ 新阶级”）' –

@CarstenLøvboAndersen谢谢！欣赏它！ –

使用以下代码：

$('[data-action="action"]').click(function() { 
    $(this).closest('.class').addclass("new-class") 
})

来源

2017-06-12 08:55:22 rroxysam

谢谢！欣赏它！ –

使用“最接近的”，其选择与通过选择所述第一祖先（在这种情况下，与第一祖先“类”类名）。在这种情况下，$（this）选择器应用于被单击的特定元素。

$('[data-action="action"]').click(function() { 
    $(this).closest(".class").addclass("new-class") 
})

来源

2017-06-12 08:55:32

你可以找到这样的点击的元素的父：

$('[data-action="action"]').click(function() { 
    $this.parents(".class").addclass("new-class") 
})

来源

2017-06-12 08:58:07

你可以用类沿为DIV提供ID ..

<div class="class" id = "my_id"> 
<div> 
    <div> 
     <button data-action="action"> 

<div class="class"> 
<div> 
    <div> 
     <button data-action="action">

SCRIPT：

$('[data-action="action"]').click(function() { 
$("#my_id .class").addclass("new-class")

}）

试试这个它会工作

来源

2017-06-12 09:01:19

你的代码不会工作$（“＃my_id .class”）'说'my_id'有一个名为class的子类。其次，添加一个div不会解决OP问题 –

在点击按钮应用事件只为它的祖先

回答

相关问题