云笔?/p>
弹出笔记子菜?/p>
1.
利用事件冒泡?/p>
note-list
上绑定事件弹出笔记子菜单
:
1.
重构笔记列表模板
,
为笔记子菜单触发按钮添加?/p>
btn-note-menu
var noteTemplate = '<li class="online note">'+ '<a>'+ '<i class="fa fa-file-text-o"
title="online" rel="tooltip-bottom"></i> [title]<button type="button" class="btn btn-default btn-
xs btn_position btn_slide_down btn-note-menu"><i class="fa fa-chevron-
down"></i></button>'+ '</a>'+ '<div class="note_menu" tabindex="-1">'+ '<dl>'+
'<dt><button type="button" class="btn btn-default btn-xs btn_move" title="
移动?/p>
..."><i
class="fa fa-random"></i></button></dt>'+ '<dt><button type="button" class="btn btn-
default btn-xs btn_share" title="
分享
"><i class="fa fa-sitemap"></i></button></dt>'+
'<dt><button type="button" class="btn btn-default btn-xs btn_delete" title="
删除
"><i class="fa
fa-times"></i></button></dt>'+ '</dl>'+ '</div>'+ '</li>';
2.
?/p>
ready
方法中绑?/p>
触发事件
//
绑定笔记子菜单的触发事件
$('#note-list').on('click', '.btn-note-menu', showNoteMenu);
3.
添加事件处理方法
/**
显示笔记子菜单处理方?/p>
*/ function showNoteMenu(){ //
找到菜单对象
,
调用
show()
方法
var btn = $(this); //
如果当前是被选定?/p>
笔记项目
就弹出子菜单
btn.parent('.checked').next().toggle();