Question

我想用javascript或CSS让这个列表更友好。我该怎么做？

在谷歌搜索时，我会得到一个不同版本的下拉菜单（页面顶部的那个，以及如何使该触摸友好

<select class="form-control" name="dob_month">
    <option>January</option>
    <option>February</option>
    <option>March</option>
    <option>April</option>
    <option>May</option>
    <option>June</option>
    <option>July</option>
    <option>August</option>
    <option>September</option>
    <option>October</option>
    <option>November</option>
    <option>December</option>
</select>

<select name="dob_date" class="form-control">
    <option value="01">1</option>
    <option value="02">2</option>
    <option value="03">3</option>
    <option value="04">4</option>
    <option value="05">5</option>
    <option value="06">6</option>
    <option value="07">7</option>
    <option value="08">8</option>
    <option value="09">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>18</option>
    <option>19</option>
    <option>20</option>
    <option>21</option>
    <option>22</option>
    <option>23</option>
    <option>24</option>
    <option>25</option>
    <option>26</option>
    <option>27</option>
    <option>28</option>
    <option>29</option>
    <option>30</option>
    <option>31</option>
</select>

<select name="dob_year" class="form-control">
    <option value='1985'>1985</option>
    <option value='1986'>1986</option>
    <option value='1987'>1987</option>
    <option value='1988'>1988</option>
    <option value='1989'>1989</option>
    <option selected value='1990'>1990</option>
    <option value='1991'>1991</option>
    <option value='1992'>1992</option>
    <option value='1993'>1993</option>
    <option value='1994'>1994</option>
    <option value='1995'>1995</option>
    <option value='1996'>1996</option>
    <option value='1997'>1997</option>
    <option value='1998'>1998</option>
    <option value='1999'>1999</option>
    <option value='2000'>2000</option>
    <option value='2001'>2001</option>
    <option value='2002'>2002</option>
    <option value='2003'>2003</option>
    <option value='2004'>2004</option>
    <option value='2005'>2005</option>
</select>

我用它来收集网站上用户的出生日期详情

Answer 1

找到符合移动浏览器的date picker widget并委托给原生<input type=date>

Answer 2

您不必使下拉列表触摸友好。移动浏览器有自己的界面，允许用户从下拉列表中选择一个选项。您可以设置选择字段的样式，但每个浏览器的选项列表都不同。

如何使此下拉列表触摸友好

2 个答案: