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
あなたのマークアップと関係するかもしれません。入力をラベルタグ内に入れ子にしてはいけません。マークアップは動的ですか?たぶん、ネストされたタグの数を減らすことに注意してください。 –