<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div id="id1">
<p>id</p>
</div>
<script src="https://code.jquery.com/jquery-1.7.2.js"></script>
<script>$('#id1').mouseenter(function(){
$('p').text('change-id');
$('#id1').attr('id','id2');
//alert($('#dsbdo').attr('id'));
});
$('#id2').mouseleave(function(){
$('p').text('cmoeback');
$('#id2').attr('id','id1');
alert($('#id').attr('id'));
})</script>
</body>
</html>
当鼠标移动进div区域时mouseenter事件能够正常触发，但是当鼠标移出div时，为什么mouseleave就不能正常触发呢？求教各位大佬，感激不尽
因为加载时没有#id2，所以在你把#id1变为#id2时并没有绑定mouseleave，你把mouseenter里加入$('#id2').mouseleave就可以了
id2是通过id1的mouseenter的方法动态加载的，所以$("body").on("mouseleave","#id2",function(){})这样写。要使用Jquery on方法委托。
怎么还给元素换id玩儿。一开始没有id为id2的元素，始终触发不了mouseleave事件。这样改就好了:
id
其实改变元素内容，这样就可以了啊:
$('#id1').on("mouseenter",function(){
$('p').text('change-id');
// $('#id1').attr('id','id2');
});
$("#id1").on("mouseleave",function(){
$('p').text('cmoeback');
// alert($('div').attr('id'));
})