是否有可能阻止这种事情:我点击输入,向下滚动某处,当我输入滚动跳转到输入。我想阻止那个跳跃。
提前致谢。
我建议不要使用此解决方案,因为您可能会遇到很多兼容性问题,您不想解决。
但是您可以将 keydown eventlister 添加到您的 inputelement 中,如果 keyIdentifier 以开头,则可以防止默认操作"U+"
(这样插入等将起作用)
然后从事件中创建一个字符串,如果未按下 shift 键,则 keyCode 值将其变为小写,并将其插入光标位置。
inputElement.addEventListener ("keydown",function (e) {
var key = e.keyCode || e.which;
var element = e.srcElement || e.target;
var ident = 0 | parseInt ( e.keyIdentifier.slice (-4) , 16)
var cursorPos = element.selectionStart || 0;
var selectionEnd = element.selectionEnd || 0;
if (key < 31 || key > 127 || ident !== key || e.ctrlKey || e.metaKey ) { return true };
if (key > 46 && key < 59 && e.shiftKey ) {
key ^= 16;
}
if ( "U+" === e.keyIdentifier.slice (0,2) ) { //We only wan't to target text input values
e.preventDefault() ; //this prevents the default action and with it the scrolling
var characters = element.value.split ("");
characters.splice (cursorPos,selectionEnd - cursorPos, String.fromCharCode (key)["to" + (e.shiftKey?"Upper":"Lower") + "Case"]());
element.value = characters.join (""); //append the string value to the input
cursorPos++;
if(element.createTextRange) {
var range = element.createTextRange();
range.move('character', cursorPos);
range.select();
}
else {
if(element.selectionStart) {
element.focus();
element.setSelectionRange(cursorPos, cursorPos);
}
else {
element.focus();
}
}
}
});
所以这是更新版本。
Known issues:
Shift + 0 -> `" "`
Shift + 3 -> `"#"`
May not work on IE.
而且可能还有更多。如果有更简单的方法,我会使用它,因为这可能需要大量用于不同键盘布局的兼容性代码。
但这是开始
您可以添加一个 keydown eventListener 并setTimeout
在滚动发生后立即滚动到原始位置。
inputElement.addEventListener ("keydown" , function () {
setTimeout (function () {
window.scroll ( window.pageXOffset , window.pageYOffset)
},0)
});
仅在 chrome 上测试。您可能会注意到闪烁,因此这也不是最佳解决方案
一种解决方案可能是在向下滚动时从文本框中移除焦点,但随后用户无法键入。