EasyUI Accordion的标题栏加自定义按钮或菜单

加 Accordion

<div class="easyui-accordion centertool">
    <div title="新建 联系人：" style="overflow:auto;padding:10px;"></div>
    <div title="新建 客户：" style="padding:10px;"></div>
    <div title="新建 商业机会(可选)：" style="padding:10px;"></div>
</div>

 

通过火狐等工具可以知道标题栏上右边的箭头是 <div class="panel-tool"></div>

实现：

 

var tools = $(".centertool").find(".panel-tool");
$(tools[0]).before("<div class='accordiontool'><a href='javascript:void(0);' id='aLinkSearch'>查询</a>&nbsp;&nbsp;<a href='javascript:void(0);' class='linkbutton' id='aLinkSave'>关联 联系人</a></div>");


$("#aLinkSearch").click(function () {
    alert("123");
    return false;
});

$("#aLinkSave").click(function () {
    alert("456");
    return false;
});

 

return false 使点击LinkButton时 Panel 收缩失效。

 

.accordiontool {position: absolute; height: 30px; line-height: 30px; right: 40px; top:11px;}
.accordiontool .linkbutton {border: 1px solid #808080; background-color: #ececec;color: #333; padding: 8px 6px; text-decoration: none;-moz-border-radius: 4px;-webkit-border-radius: 4px;border-radius: 4px;}
.accordiontool .linkbutton:hover {border-color: #3072b3;border-bottom-color: #2a65a0;background-color: #3072b3;color: #fff; }

 

加上点样式。

 

转载于:https://www.cnblogs.com/chenliang-zibo/p/4362611.html