html委托事件,事件委托.html

事件委托

li{

height:30px;

border:1px solid #000;

background-color: #ccc;

}

li span{

float: right;

font-size: 20px;

cursor: pointer;

}

$(function(){

// 点击关闭按钮时关闭一整行

/*$('ul li span').click(function(){

$(this).parent().remove();

});*/

// 此处新添加的元素是没有点击span元素删除一整行的功能

// $('input:button').click(function(){

// $('ul').prepend('

new ×');

// });

$('input:button').bind('click',function(){

$('ul').prepend('

new ×');

});

/*

// 使用delegate来做事件委托

// 通常将事件委托给他们的公共父级

$('ul').delegate('li span','click',function(){

$(this).parent().remove();

});

//取消事件委托

//$('ul').undelegate();

*/

//用on来做事件委托

$('ul').on('click','li span',function(){

$(this).parent().remove();

});

//取消事件委托

//$('ul').off();

});

• ×
• ×
• ×

一键复制

编辑

Web IDE

原始数据

按行查看

历史