iPad IOS html form select does not open on touch

问题:

I have a select box, created in the following way:

<select id="size" onchange="location=this.options[this.selectedIndex].value;" name="size">
    <option value="#catalog_860">16</option>
    <option value="#catalog_861">17</option>
    <option value="#catalog_862">18</option>
    <option selected="selected" value="#catalog_863">19</option>
</select>

On Desktop Safari and other browsers it works like expected.

On Mobile Safari (iPad) it does not respond to touching. When I connect a label with it, touching the label results in visibly selecting the select (the down arrow button turns blue), but it does not show the options.

I am fighting it for two hours now. What am I missing?

回答1:

I bumped into the same thing as well. Check any where in your javascript if you call

e.preventDefault();

on the 'touchstart' event. I manage to avoid this by

function touchStart(e) {
    if (e.target.tagName != 'SELECT') {
        e.preventDefault();
    }
    ...
}