|
60 | 60 | .on('mouseenter',$.proxy(this.mouseenterHandler,this)) |
61 | 61 | .on('mouseleave',$.proxy(this.mouseleaveHandler,this)); |
62 | 62 | } |
63 | | - $('body').off('keyup.webui-popover').on('keyup.webui-popover',$.proxy(this.escapeHandler,this)); |
64 | 63 | this._poped = false; |
65 | 64 | this._inited = true; |
66 | 65 | }, |
|
74 | 73 | } |
75 | 74 | }, |
76 | 75 | hide:function(event){ |
77 | | - if (event){event.preventDefault();} |
| 76 | + if (event){ |
| 77 | + event.preventDefault(); |
| 78 | + event.stopPropagation(); |
| 79 | + } |
78 | 80 | var e = $.Event('hide.' + pluginType); |
79 | 81 | this.$element.trigger(e); |
80 | | - |
81 | 82 | if (this.$target){this.$target.removeClass('in').hide();} |
82 | 83 | this.$element.trigger('hidden.'+pluginType); |
83 | 84 | }, |
84 | 85 | toggle:function(e){ |
85 | | - if (e) {e.preventDefault();} |
| 86 | + if (e) { |
| 87 | + e.preventDefault(); |
| 88 | + e.stopPropagation(); |
| 89 | + } |
86 | 90 | this[this.getTarget().hasClass('in') ? 'hide' : 'show'](); |
87 | 91 | }, |
88 | 92 | hideAll:function(){ |
89 | | - $('div.webui-popover').removeClass('in').hide(); |
| 93 | + $('div.webui-popover').not('.webui-popover-fixed').removeClass('in').hide(); |
90 | 94 | }, |
91 | 95 | /*core method ,show popover */ |
92 | 96 | show:function(){ |
|
111 | 115 | $target.show(); |
112 | 116 | } |
113 | 117 | this.displayContent(); |
| 118 | + this.bindBodyEvents(); |
114 | 119 | }, |
115 | 120 | displayContent:function(){ |
116 | 121 | var |
|
247 | 252 | } |
248 | 253 | }); |
249 | 254 | }, |
| 255 | + |
| 256 | + bindBodyEvents:function(){ |
| 257 | + $('body').off('keyup.webui-popover').on('keyup.webui-popover',$.proxy(this.escapeHandler,this)); |
| 258 | + $('body').off('click.webui-popover').on('click.webui-popover',$.proxy(this.bodyClickHandler,this)); |
| 259 | + }, |
| 260 | + |
250 | 261 | /* event handlers */ |
251 | 262 | mouseenterHandler:function(){ |
252 | 263 | var self = this; |
|
262 | 273 | }, |
263 | 274 | escapeHandler:function(e){ |
264 | 275 | if (e.keyCode===27){ |
265 | | - this.hide(); |
266 | 276 | this.hideAll(); |
267 | 277 | } |
268 | 278 | }, |
| 279 | + bodyClickHandler:function(){ |
| 280 | + this.hideAll(); |
| 281 | + }, |
| 282 | + |
| 283 | + targetClickHandler:function(e){ |
| 284 | + e.stopPropagation(); |
| 285 | + }, |
269 | 286 |
|
270 | 287 | //reset and init the target events; |
271 | 288 | initTargetEvents:function(){ |
|
275 | 292 | .on('mouseleave',$.proxy(this.mouseleaveHandler,this)); |
276 | 293 | } |
277 | 294 | this.$target.find('.close').off('click').on('click', $.proxy(this.hide,this)); |
| 295 | + this.$target.off('click.webui-popover').on('click.webui-popover',$.proxy(this.targetClickHandler,this)); |
278 | 296 | }, |
279 | 297 | /* utils methods */ |
280 | 298 | //caculate placement of the popover |
|
345 | 363 | arrowSize = this.options.arrow?28:0, |
346 | 364 | fixedW = elementW<arrowSize+10?arrowSize:0, |
347 | 365 | fixedH = elementH<arrowSize+10?arrowSize:0; |
348 | | - console.log(elementW,arrowSize); |
349 | 366 | switch (placement) { |
350 | 367 | case 'bottom': |
351 | 368 | position = {top: pos.top + pos.height, left: pos.left + pos.width / 2 - targetWidth / 2}; |
|
0 commit comments