html
| 代碼如下 |
複製代碼 |
<ul id="Hover">
<li>標題標題<i class="modify" style="display:none">修改</i><i class="delete" style="display:none">刪除</i></li>
<li>標題標題<i class="modify" style="display:none">修改</i><i class="delete" style="display:none">刪除</i></li>
<li>標題標題<i class="modify" style="display:none">修改</i><i class="delete" style="display:none">刪除</i></li>
</ul> |
js
| 代碼如下 |
複製代碼 |
// 以下代碼對使用js動態增加的元素沒有效果，需要使用on替換
$("li","#Hover").hover(function(){
$(".modify,.delete",$(this)).show();
},function(){
$(".modify,.delete",$(this)).hide();
}); //jquery 1.9 要使用 on 綁定事件，滑鼠經過顯示修改和刪除效果
$("#Hover").on({
mouseenter: function(){
$(".modify,.delete",$(this)).show();
},
mouseleave: function(){
$(".modify,.delete",$(this)).hide();
}
}, "li"); // descendant selector |
hover不是標準的事件，因此無法直接使用live進行處理，故使用以下方法代替，效果一樣
| 代碼如下 |
複製代碼 |
$("table tr").live({
mouseenter:
function()
{
//todo
},
mouseleave:
function()
{
//todo
}
}); |
