onclick 选中元素和非选中元素jquery

Question

在下面的 jquery 代码中，如何在 <p>Click D3</p> 上包含 onclick 事件，我包含了 d1 和 d2 的 onclick p。我不知道如何在同一语句中包含 <p>Click D3</p> 单击事件，即 $(".d1,.d2").on('click','p',function(){

$(".d1,.d2").on('click','p',function(){
  console.log($(this).text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="d1">
  <p>Click D1</p>
</div>
<div class="d2">
  <p>Click D2</p>
</div>
<p>Click D3</p>

Answer 1

如果你做 parent.on('click', element, function (){}) 那么除了在其中添加 div (.d3) 和 select 和 p 之外，你什么也做不了.. 如果你没有任何其他 p 标签，那么你可以将事件侦听器更改为： $("body").on('click', 'p' ,function (){ console.log($(this).text()); }); 或者你也可以将所有这些 p 标签包装在一个 div 中

$(".d1, .d2, .d3").on('click','p',function (){
  console.log($(this).text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="d1">
  <p>Click D1</p>
</div>
<div class="d2">
  <p>Click D2</p>
</div>
<div class="d3">
<p>Click D3</p>
</div>

Answer 2

添加新的 class 名称以解决它。

$('.d p').on('click', function(e){
  console.log($(this).text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="d d1">
<p>Click D1</p>
</div>
<div class="d d2">
<p>Click D2</p>
</div>
<div class="d">
<p>Click D3</p>
</div>

onclick 选中元素和非选中元素jquery

onclick on selected elements and non selected elements jquery

jquery

jquery-selectors