1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
$seats.find('a.seat').not('.disabled').popover({ html: true, trigger: 'manual', title: function(){ return '訂票資訊'; }, content: function(){ var $this = $(this); var $c = $('<div class="pop">' + '<select name="ticket" class="input-medium"><option value="">-- 選擇票種 --</option><option value="1">學生</option></select>' + '</div>'); $c.find('select').change(function(event){ selected($(this).val(), $this); $this.addClass('selected').popover('hide'); }); return $c[0]; } }).click(function(event){ $(this).popover('toggle'); event.stopPropagation(); }); |
Note:
- trigger: manual and event.stopPropagation() are the keys
- http://twitter.github.io/bootstrap/javascript.html#popovers
- http://stackoverflow.com/questions/8947749/how-can-i-close-a-twitter-bootstrap-popover-with-a-click-from-anywhere-else-on