Liferay 从Dockbar 添加Portlet的事件细节研究

Part 1: 从页面点击"Add"过程找出事件处理函数：

在Liferay中，当我们从左边选择一个Portlet并且添加的时候，会触发一系列的动作，并且最终把这个Portlet显示在页面上，现在我们就对这个神秘的过程进行窥测。

在页面上，为了找到我们点击Add之后绑定的事件处理函数，我们先找到这段代码对应的jsp页面在/html/portlet/layout_configuration/view_category.jsp中：

<div
    class="lfr-portlet-item lfr-archived-setup"
    id="<portlet:namespace />portletItem<%= portletItem.getPortletItemId() %>"
    instanceable="<%= portletInstanceable %>"
    plid="<%= plid %>"
    portletId="<%= portlet.getPortletId() %>"
    portletItemId="<%= portletItem.getPortletItemId() %>"
    title="<%= HtmlUtil.escape(portletItem.getName()) %>"
>
    <p><%= HtmlUtil.escape(portletItem.getName()) %> <a href="javascript:;"><liferay-ui:message key="add" /></a></p>
</div>

因为昨天我们研究过，这个文本任意变动都不会影响到添加Portlet事件的触发（参见http://supercharles888.blog.51cto.com/609344/908773）文章，所以我们确定点击事件和显示内容无关，而页面上除了这个文本以外任何地方点击都无效（不触发添加Portlet事件），由此看来，我们的事件最终是绑定到<a>元素的，因为这是它唯一和其他部分不同的地方。

最终，我们在/html/js/liferay/layout_configuration.js 中找到了事件绑定关联的地方，它在_loadContent方法中：

_loadContent: function() {
                    var instance = this; 

                    Liferay.fire('initLayout'); 

                    instance.init(); 

                    Util.addInputType(); 

                    Liferay.on('closePortlet', instance._onPortletClose, instance); 

                    instance._portletItems = instance._dialogBody.all('div.lfr-portlet-item'); 

                    var portlets = instance._portletItems; 

                    instance._dialogBody.delegate(
                        'mousedown',
                        function(event) {
                            var link = event.currentTarget;
                            var portlet = link.ancestor('.lfr-portlet-item'); 

                            instance._addPortlet(portlet);
                        },
                        'a'
                    );

以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索页面
， instance
， 事件
， portlet
liferay
liferay dockbar、liferay portlet 开发、liferay mvcportlet、liferay portlet 跳转、liferay portlet，以便于您获取更多的相关知识。