Browser Compatibility and Workarounds
Not all browsers are made the same, browser fallbacks are a big part of css
IE8
** No array.map support **
Solution
Use underscore’s _.map
instead (backbone objects are exception)
** No select event support ** Solution Use jquery’s select event for binding the the view’s render method. TODO example
** Clicking on modal popup that triggers a hash change ** Solution Intercept click and prevent default
Non Webkit
** Can’t stretch textarea using position: absolute and left, right, top, bottom ** Solution Resorted to setting width and height
iPad
Visual fixes and event processing can be fixed using iScroll and jquery.ui.touch plugins to handle the touch and scrolling bugs.
Setting Focus to Bring up keyboard
See http://stackoverflow.com/questions/6287478/mobile-safari-autofocus-text-field: iOS will only allow focus to be triggered on other elements, from within a function, if the first function in the call stack was triggered by a non-programmatic event.
Selecting Text in Input Fields
Use the setSelectionRange method. See https://developer.mozilla.org/en/DOM/Input.setSelectionRange. However, it will only work if the input is focused via the first function in the call stack (see above focus issue) and the keyboard is visiable.
Example: input.setSelectionRange(0, 9999) or $(‘input’).get(0).setSelectionRange(0, 9999)