iScroll滾動區域中select、input、textarea元素沒法點擊的Bug修復

最近在一個項目中使用了iScroll4模擬滾動效果，調試過程當中發現一個表單頁中的全部表單項都沒法點擊聚焦， 如<select>、<input>、<textarea>。這是由於iScroll要監聽整個頁面事件，爲了達到 最優效果，它默認禁用了全部元素的默認事件（但也有例外，如<a>默認事件不受影響），因此才形成這些表單元素點擊沒有反應，沒法正常聚焦。

咱們打開 iscroll.js ，找到這一行：
onBeforeScrollStart : function(e){ e.preventDefault(); },
將其改成：
onBeforeScrollStart : function(e){var nodeType = e.explicitOriginalTarget ? e.explicitOriginalTarget.nodeName.toLowerCase() : (e.target ? e.target.nodeName.toLowerCase() : 」);if(nodeType != ‘select’ && nodeType != ‘option’ && nodeType != ‘input’ && nodeType != ‘textarea’){e.preventDefault();}},

這樣，input及textarea能夠正常聚焦了，可是發現select點擊仍是沒有彈出下拉列表框。

這是由於 iscroll 默認使用的是css的transform變形中的translate3d實現區域滾動，每次滾動實際是改變translate3d中的y軸值，實際的 dom位置並無發生變化。translate3d會致使頁面的焦點錯誤，系統級下拉菜單的顯示則會致使其出現顯示偏離。

控制滾動模式的代碼默認是：useTransform: true。好在iscroll提供了另外一種滾動方式，基於絕對定位位置變化的滾動。修改成useTransform: false以後，iscroll就會使用對定位位方式來實現滾動，該方式是咱們在web開發中模擬動畫的最經常使用方式，滾動以後dom的實際位置也同步發生 了變化，不會出現錯位偏離現象。

以上修改後，全部的表單元素都能正常使用了，不過須要注意，使用對position決定定位後，滾動區的寬度默認會自適應內容寬度，而不是父元素的100%，因此最好將滾動區域寬度設爲100%。