3

我们有一个下拉列表(html 选择),其中包含从 00 到 59 的数字(分钟的可能值)。当控件处于焦点并且用户使用键盘输入 13(或 24 或 59 等)时,它会在控件中选择数字 13(或 24 或 59 等)。这是预期的行为。

但是当用户输入像 44 这样的数字时,它会选择 40,然后选择 41。同样是 22、33、55 的问题。

这是 Firefox、Chrome、Safari 的行为。有趣的是,在 IE9 中它工作正常(你输入 44 它选择 44)

请建议如何在所有浏览器中使“html select”的行为统一。最好是它在 IE9 中的工作方式,这似乎是正确的。

示例代码:

<html>
<body>
Select Minutes: 
    <select id="hr_sel_min">
        <option title="00" value="00" selected="selected">00</option>
        <option title="01" value="01">01</option>
        <option title="02" value="02">02</option>
        <option title="03" value="03">03</option>
        <option title="04" value="04">04</option>
        <option title="05" value="05">05</option>
        <option title="06" value="06">06</option>
        <option title="07" value="07">07</option>
        <option title="08" value="08">08</option>
        <option title="09" value="09">09</option>
        <option title="10" value="10">10</option>
        <option title="11" value="11">11</option>
        <option title="12" value="12">12</option>
        <option title="13" value="13">13</option>
        <option title="14" value="14">14</option>
        <option title="15" value="15">15</option>
        <option title="16" value="16">16</option>
        <option title="17" value="17">17</option>
        <option title="18" value="18">18</option>
        <option title="19" value="19">19</option>
        <option title="20" value="20">20</option>
        <option title="21" value="21">21</option>
        <option title="22" value="22">22</option>
        <option title="23" value="23">23</option>
        <option title="24" value="24">24</option>
        <option title="25" value="25">25</option>
        <option title="26" value="26">26</option>
        <option title="27" value="27">27</option>
        <option title="28" value="28">28</option>
        <option title="29" value="29">29</option>
        <option title="30" value="30">30</option>
        <option title="31" value="31">31</option>
        <option title="32" value="32">32</option>
        <option title="33" value="33">33</option>
        <option title="34" value="34">34</option>
        <option title="35" value="35">35</option>
        <option title="36" value="36">36</option>
        <option title="37" value="37">37</option>
        <option title="38" value="38">38</option>
        <option title="39" value="39">39</option>
        <option title="40" value="40">40</option>
        <option title="41" value="41">41</option>
        <option title="42" value="42">42</option>
        <option title="43" value="43">43</option>
        <option title="44" value="44">44</option>
        <option title="45" value="45">45</option>
        <option title="46" value="46">46</option>
        <option title="47" value="47">47</option>
        <option title="48" value="48">48</option>
        <option title="49" value="49">49</option>
        <option title="50" value="50">50</option>
        <option title="51" value="51">51</option>
        <option title="52" value="52">52</option>
        <option title="53" value="53">53</option>
        <option title="54" value="54">54</option>
        <option title="55" value="55">55</option>
        <option title="56" value="56">56</option>
        <option title="57" value="57">57</option>
        <option title="58" value="58">58</option>
        <option title="59" value="59">59</option>
    </select> &nbsp;minutes
</body>

</html>

请在 jsFiddle 中找到示例代码:http: //jsfiddle.net/2QTvJ/

(在 IE9 和 chrome 中打开示例查看差异。)

4

1 回答 1

0

正如 Raheel 所说,它会从你击中的角色开始上升到下一个值,例如 4 或 5。您可以有一个文本框输入,然后更改下拉值或可以区分该值的其他类型的表单元素。

另一种方法是用 jquery keypress 函数区分值。

http://api.jquery.com/keypress/

于 2013-04-10T08:39:32.143 回答