Input time mit vorgabe

[Jens Müller (Incognito)]

Moin,

Hi,
Ist es irgendwie möglich eine <input type="time"> Feld vorzugeben welche Uhrzeiten man nur auswählen kann?

In der Regel, ja. <input type="time" name="uhrzeit" min="9" max="22" value="19:09">

Wobei Min am 9 Uhr startet und Max dann heißt, bis 22 Uhr

Ich hab bis her immer die möglichen Zeiten als Liste ausgegeben und dann mit Radio-Button auswählen lassen. Zum Teil wird die Seite dann aber extrem lang.
Oder hat jemand eine andere Idee wie ich das anschaulicher darstellen könnte?

Wieso ein Radiobutton, kennst du das <datalist> Element?

<div id="timepicker">
  <div class="time-show">
    <span class="time">Zeit : </span>
    <input type="text" name="time-hours" list="time-hours-select" min="9" max="22" placeholder="19">
      <datalist id="time-hours-select">
        <option>9</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
        <option>13</option>
        <option>14</option>
        <option>15</option>
        <option>16</option>
        <option>17</option>
        <option>17</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
      </datalist>
    <input type="text" name="time-minutes" list="time-minutes-select" min="00" max="59" placeholder="09">
      <datalist id="time-minutes-select">
        <option>00</option>
        <option>09</option>
        <option>15</option>
        <option>30</option>
        <option>45</option>
      </datalist>
  </div>
</div>

Was mich an dieser Lösung stört. Bisher ist es mir noch nicht gelungen, die <option> Elemente mit CSS zu Rendern. Die werden noch vom OS gestyled, bzw vom Browser Stylesheet.

schönen Pfingtsmontag noch, jens mueller