Question

jQuery的新手，我有一个关于事件委托的问题。以下是来自javascript book

的一系列代码

HTML：

<ul class="accordion">
    <li>
      <button class="accordion-control">Classics</button>
      <div class="accordion-panel">
        <p>If you ...</p>
      </div>
    </li>
    <li>
      <button class="accordion-control">The Flower Series</button>
      <div class="accordion-panel">
        <p>Take your ...</p>
      </div>
    </li>
    <li>
      <button class="accordion-control">Salt o' The Sea</button>
      <div class="accordion-panel">
        <p>Ahoy! ....</p>
      </div>
    </li>
  </ul>

jQuery的：

$('.accordion').on('click', '.accordion-control', function(e){ 
     e.preventDefault();                  
     $(this).next('.accordion-panel')            
         .not(':animated')                   
         .slideToggle();                      
});

我想知道因为我们已经选择了'.accordion'，那么为什么我们还需要选择'.accordion-control'？我以前认为公式应该是$(selector).on(event,function)，所以在事件之后还有另一个选择器吗？

Answer 1

第一个accordion指的是祖先。绑定将在click事件上，对于其中一个名为accordion-control的后代。当后代尚不存在时使用祖先（例如，如果您的accordion-control是使用脚本创建的，而不是从页面加载（在HTML中）存在 - 那么您就无法将事件绑定到不存在的元素。如果它＆＃39;不是你的情况（意味着你的accordion-conrtol从一开始就存在），你也可以使用$(selector).click(function)： $('accordion-control').click(function (event) { //your code });

有关详细信息，请查看：http://api.jquery.com/on/

在jquery

1 个答案: