我使用iScroll4插件(http://cubiq.org/iscroll-4/)將滾動條添加到長度超過瀏覽器視口高度80%的頁面。出於某種原因,當(並且僅在這種情況下)我添加它並嘗試點擊輸入時,它將不會選擇。只需點擊其標籤即可選擇輸入。爲什麼我不能點擊輸入?
我能做些什麼來使iScroll4和可選擇的輸入?
我使用iScroll4插件(http://cubiq.org/iscroll-4/)將滾動條添加到長度超過瀏覽器視口高度80%的頁面。出於某種原因,當(並且僅在這種情況下)我添加它並嘗試點擊輸入時,它將不會選擇。只需點擊其標籤即可選擇輸入。爲什麼我不能點擊輸入?
我能做些什麼來使iScroll4和可選擇的輸入?
嘗試這種解決方案
myScroll = new iScroll('wrapper', {});
myScroll.options.onBeforeScrollStart = function(e) {
var target = e.target;
while (target.nodeType != 1) target = target.parentNode;
if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA'){
e.preventDefault();
}
}
$('input[type=text]').bind('touchstart click', function(){
$(this).focus();
});
var myScroll;
function loaded() {
myScroll = new iScroll('wrapper', { scrollbarClass: 'myScrollbar' });
myScroll.options.onBeforeScrollStart = function(e) {
var target = e.target;
while (target.nodeType != 1) target = target.parentNode;
if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA'){
e.preventDefault();
}
}
}
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', loaded, false);
我使用5.1.2版和它的工作。
window.myScroll = new IScroll ('#iscroll-wrapper',
probeType: 3,
mouseWheel: true,
scrollbars: true,
bounce: true,
keyBindings: true,
invertWheelDirection: false,
momentum: true,
fadeScrollbars: false,
interactiveScrollbars: true,
resizeScrollbars: true,
shrinkScrollbars: false,
click: false,
preventDefaultException: { tagName:/.*/ }
}
奇怪的是,右鍵單擊'input'元素會將焦點移動到該元素(即使您關閉上下文菜單),但不能單擊。 – 2012-02-09 11:41:22
是的,它適用於右鍵單擊和標籤單擊,但不是左鍵單擊也適用於我:) – Atadj 2012-02-09 11:44:29
它可能與您的標記有關。您不應該在標籤標籤中嵌套輸入。標記是否動態?也許你應該考慮削減嵌套標籤的數量。 – 2012-02-09 13:46:09