jquery 虚拟键盘 - Chrome 和 Edge 中的光标不闪烁
Posted
技术标签:
【中文标题】jquery 虚拟键盘 - Chrome 和 Edge 中的光标不闪烁【英文标题】：jquery virtual keyboard - Curser not blinking in Chrome and Edge 【发布时间】：2021-06-15 16:34:13 【问题描述】：我使用了 jQuery 虚拟键盘，但是在 chrome 和 Edge 浏览器中发现了一个问题。当我单击文本框时，光标焦点不起作用，并且在编辑文本时无法看到正在输入的位置。但在 IE 浏览器中它运行良好。我需要知道为什么它在 Chrome 和 Edge 浏览器中不起作用以及如何解决这个问题。有人可以帮我解决这个问题吗？
【问题讨论】：
【参考方案1】：根据你的描述，我创建了一个简单的例子来测试，运行正常，输入框可以正确显示光标。 这是我的测试演示（在 Edge 版本 91.0.864.48 中）：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Demo</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/virtual-keyboard/1.30.3/css/keyboard-basic.min.css" rel="stylesheet" />
</head>
<body>
<div>
Enter something here: <input type="text" name="name" contenteditable="true" id="enterBox" value="" />
</div>
<br />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/virtual-keyboard/1.30.3/js/jquery.keyboard.min.js"></script>
<script>
$.keyboard.keyaction.undo = function (base)
base.execCommand('undo');
return false;
;
$.keyboard.keyaction.redo = function (base)
base.execCommand('redo');
return false;
;
$('#enterBox').keyboard(
usePreview: true, // disabled for contenteditable
useCombos: false,
autoAccept: true,
layout: 'custom',
customLayout:
'normal': [
'` 1 2 3 4 5 6 7 8 9 0 - = del b',
'tab q w e r t y u i o p [ ] \\',
'a s d f g h j k l ; \' enter',
'shift z x c v b n m , . / shift',
'accept space left right undo:Undo redo:Redo'
],
'shift': [
'~ ! @ # $ % ^ & * ( ) _ + del b',
'tab Q W E R T Y U I O P |',
'A S D F G H J K L : " enter',
'shift Z X C V B N M < > ? shift',
'accept space left right undo:Undo redo:Redo'
]
,
display:
del: '\u2326:Delete',
redo: '↻',
undo: '↺'
);
//.addTyping();
</script>
</body>
</html>
结果： https://i.stack.imgur.com/J4qG9.gif
你能提供一个最小的例子来重现这个问题吗？这将有助于解决问题，感谢您的理解。
【讨论】：
以上是关于jquery 虚拟键盘 - Chrome 和 Edge 中的光标不闪烁的主要内容，如果未能解决你的问题，请参考以下文章