Question

有没有人知道为什么我的代码“委托”功能有效而不是“开启”或“绑定”？

$(document).ready(function(){
  $("div").on("p","click",function(){
    $("p").css("background-color","pink");
  });
});

由于

Answer 1

您目前使用的内容适用于 .delegate() 。 .on() 的正确参数顺序为：

.on( events [, selector ] [, data ], handler(eventObject) )

因此您需要先指定事件，然后按照选择器进行操作：

$("div").on("click","p",function(){
    $("p").css("background-color","pink");
});

<强> Fiddle Demo

Answer 2

尝试

$(document).ready(function(){
  $("div").on("click","p",function(){
    $(this).css("background-color","pink"); // this will change color on inside p
  });
});

DEMO

$(document).ready(function(){
  $("div").on("click","p",function(){
    $('p').css("background-color","pink"); // this will change color on all p
  });
});

“自jQuery 1.7起，.delegate()方法已取代.on()。”

“从jQuery 1.7开始，.on()方法提供了附加事件处理程序所需的所有功能。”

使用.bind()方法非常昂贵，因为它附带相同的方法    事件处理程序到选择器中匹配的每个项目。

您应该停止使用.live()方法，因为它已被弃用并具有    很多问题。

.delegate()方法给了很多“砰然作响”    处理性能并对动态添加的元素做出反应。

新的.on（）方法主要是可以模仿的语法糖    .bind()，.live()或.delegate()取决于您的称呼方式。

新方向是使用新的.on方法。熟悉    语法并开始在所有jQuery 1.7+项目中使用它。

Reference

Answer 3

Event type必须是.on()声明

中的第一个参数

selector必须是第二个参数。

data必须是第三个参数及其可选

而不是

 $("div").on("p","click",function(){ 
       $("p").css("background-color","pink");
 });

使用

 $("div").on("click","p",function(){ 
      $("p").css("background-color","pink");
 });

Fiddle

Answer 4

而不是使用$('div').on('click','p',function...使用$('div p').on('click',function...

http://jsfiddle.net/UPNaF/4/

$(document).ready(function(){
  $("div p").on("click",function(){
    $(this).css("background-color","pink");
  });
});

on和bind不工作但委托工作

4 个答案: