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' 요소를 마우스 오른쪽 버튼으로 클릭하면 컨텍스트 메뉴를 닫을 때라도 해당 요소로 포커스가 이동하지만 클릭하지는 않습니다. –
예, 마우스 오른쪽 버튼으로 클릭하고 레이블을 클릭하면 작동하지만 나에게도 왼쪽 클릭하지 마십시오. – Atadj
마크 업과 관련이있을 수 있습니다. 레이블 태그 안에 입력을 중첩하면 안됩니다. 마크 업이 동적입니까? 어쩌면 중첩 된 태그의 수를 줄이는 방법을 고려해야합니다. –