我正在创建一个jquery移动小部件,它通过提供自定义控件来增强textarea,并将原始textarea隐藏在屏幕外。通过输入文本与自定义控件交互时,用户实际将文本输入textarea。
某些字符(例如换行符)需要放在textarea中的特定位置。这是通过监听输入事件,获取textarea中的当前文本,检查和添加任何换行,然后将textarea中的文本设置为更新文本来完成的。
这适用于Chrome(v39,Windows 7),Firefox(v35,Windows 7)和Chrome for Android(v39,Android 4.4.4)。
然而,当在Firefox for Android(v35,Android 4.4.4)中运行时,每次更新后textarea中的文本都不应该是它。例如,如果您输入Th
,则会在textarea而不是_T
中获得Th
。
下面的示例代码演示了在Firefox for Android中查看它并在textarea中输入文本时出现此问题:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script>
$(function(){
$('#ta').on("input",function(e){
var selection = this.selectionEnd;
var text = document.getElementById("ta").value + " ";
this.selectionStart = 0;
this.selectionEnd = text.length - 1;
document.getElementById("ta").value = text;
this.selectionStart = selection;
this.selectionEnd = selection;
});
});
</script>
</head>
<body>
<textarea id="ta"></textarea>
</body>
</html>
这是指向bug report
的链接有没有办法检测包含此错误的浏览器,以便我可以只显示非增强型textarea?
我真的不想使用User Agent字符串,因为人们可能会通过尝试请求桌面版本来修改它。
我唯一的另一个想法是在更新后检查文本区域中的文本与我认为它应该是相同的,但是这会在错误发生之前显示增强版本,这不是理想的。