code: function(e) {
              // Not show again
              if (this.isShown) {
                  return;
              }
  
              raiseCallback(this.options.beforeShow);
  
              var self = this;
  
              // Initialize
              if (!this.isAppended) {
                  // Append template to body
                  $body = $(document.body).append(this.template);
  
                  // Reset position when resize
                  $win.on('resize.jqclockpicker' + this.id, function() {
                      if (self.isShown) {
                          self.locate();
                      }
                  });
  
                  this.isAppended = true;
              }
  
              var value = this.input.prop('value') || this.options.defaultTime || '';
  
              var time = this._parseTime(value, this.options.timeFromNow);
  
              this._setTime(time);
  
              this._updateLabels();
  
              // Toggle to hours view
              this.toggleView('hours');
  
              // Set position
              this.locate();
  
              this.isShown = true;
  
              // Hide when clicking or tabbing on any element except the clock and input
              $doc.on('click.jqclockpicker.' + this.id + ' focusin.jqclockpicker.' + this.id, function(e) {
                  var target = $(e.target);
                  if (target.closest(self.template).length === 0 &&
                      target.closest(self.input).length === 0) {
                      self.hide();
                  }
              });
  
              // Hide when ESC is pressed
              $doc.on('keyup.jqclockpicker.' + this.id, function(e) {
                  if (e.keyCode === 27) {
                      self.hide();
                  }
              });
  
              raiseCallback(this.options.afterShow);
          }
docs: Show picker