5

iOS 8 Jquery Submit Button Focus Bug

 3 years ago
source link: https://www.codesd.com/item/ios-8-jquery-submit-button-focus-bug.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

iOS 8 Jquery Submit Button Focus Bug

advertisements

Recently we started to receive some complaints that the button on a page stopped to work under ipad - ios8, doing a bit of testing we found that out code when enabling the button and setting the focus() if we had the focus in another place the button would never get the focus and worst it wasn't responding to the click.

Below is a fiddler that simulates this problem, first select the textbox to set the focus on it, then press the button P1 and try to press the Do Something Button.

Fiddler Here

$("#some_submit_button").prop("disabled",true);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<input type="button" id="P1" value="P1" onclick="P1Click()" />

<input type="text" id="textP"  />

<p> </p>
<input type="submit" id="some_submit_button" value="Do Something" onclick="Submit()" />

<script>
function P1Click() {
    $("#P1").prop("disabled",true);
    $("#some_submit_button").prop("disabled",false);
    $("#some_submit_button").focus();
}
function Submit(){
    alert('Submited the form');
}
 </script>

Did anyone else encountered this bug? Is there an workaround for this?

Best Regards


Same problem here.

Workaround:
Don't set the focus on iPad, iPod, iPhone (mostly people don't use hardware keyboards on these devices to navigate).

if((!navigator.userAgent.match(/iPhone/i)) && (!navigator.userAgent.match(/iPod/i)) && (!navigator.userAgent.match(/iPad/i))) {
    $("#some_submit_button").focus();
} else {
    // hide keyboard on mobile
    $("#textP").blur();
}


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK