title: jQuery timepicker - not working when readonly
body: <p>I'm using Jon Thornton's jQuery timepicker (<a href="http://jonthornton.github.io/jquery-timepicker/" rel="nofollow">http://jonthornton.github.io/jquery-timepicker/</a>) for the time field in a form, but I've recently decided that I need to make the field readonly so that users can't enter any text other than the times in the picker.  However, when I add the readonly attribute to the time input field, the timepicker no longer works - it doesn't appear when I click on the field.</p>
  
  <p>I'm a little confused, because I am also using a jQuery calendar on another field that is set to readonly, and that works just fine.  Can anyone help me out?</p>
  
  <pre><code>&lt;head&gt;
      &lt;!--DATEPICKER--&gt;
      &lt;link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"&gt;
      &lt;script src="http://code.jquery.com/jquery-1.10.2.js"&gt;&lt;/script&gt;
      &lt;script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"&gt;&lt;/script&gt;
  
      &lt;!--TIMEPICKER--&gt;
      &lt;script type="text/javascript" src="jquery.timepicker.js"&gt;&lt;/script&gt;
      &lt;link rel="stylesheet" type="text/css" href="jquery.timepicker.css" /&gt;
  
      &lt;script&gt;
          $(function(){
              $("#date").datepicker({maxDate: "+0D" , dateFormat: "yy-mm-dd"});
              $("#time").timepicker();
          });
      &lt;/script&gt;
  &lt;/head&gt;
  
  ...
  
  &lt;input type="text" name="date" id="date" readonly="true"&gt;
  &lt;input type="text" name="time" id="time" readonly="true"&gt;
  </code></pre>
  
  <p>Thanks very much.</p>