iOS 11 Safari HTML – 禁用“智能标点符号”?

是否有一种很好的方法可以禁用iOS 11 Apple键盘生成的“ 智能标点符号” – 在HTML登录表单的Safari中 – 特别是用户名字段?

问题是我们的用户名中有撇号的用户。 在iOS 11上键入他们的用户名并且不知道unicode的微妙之处,他们无法登录。

理想情况下,我们可以通过按住撇号键来指示此类用户禁用智能引号或键入正确的字符 – 但我正在为小孩子制作教育软件,这是不可能的。

问题更加复杂的是,在用户名中只有少量用户选择实际的单引号 ,因此简单的替换地图将无效 – 我们无法规范化用户名,因为它们来自一个数字外部系统我们无法控制/不能说很多。

不幸的是,根据这个MDN页面 ,没有已知的Webkit 属性来禁用智能引号,但您可以使用我从这个QA派生的脚本对其进行修补: 如何禁用textarea字段的智能引号在浏览器中?

 window.addEventListener('DOMContentLoaded', attachFilterToInputs ); function attachFilterToInputs() { var textInputs = document.querySelectorAll( 'input[type=text], input[type=[password], input[type=email], input[type=search], input[type=url], textarea, *[contenteditable=true]' ); for( var i = 0; i < textInputs.length; i++ ) { textInputs[i].addEventListener( 'keypress', preventPretentiousPunctuation ); } } var conversionMap = createConversionMap; function createConversionMap() { var map = {}; // Open-quotes: http://www.fileformat.info/info/unicode/category/Pi/list.htm map[ 0x2018 ] = '\''; map[ 0x201B ] = '\''; map[ 0x201C ] = '"'; map[ 0x201F ] = '"'; // Close-quotes: http://www.fileformat.info/info/unicode/category/Pf/list.htm map[ 0x2019 ] = '\''; map[ 0x201D ] = '\"'; // Primes: http://www.fileformat.info/info/unicode/category/Po/list.htm map[ 0x2032 ] = '\''; map[ 0x2033 ] = '"'; map[ 0x2035 ] = '\''; map[ 0x2036 ] = '"'; map[ 0x2014 ] = '-'; // iOS 11 also replaces dashes with em-dash map[ 0x2013 ] = '-'; // and "--" with en-dash return map; } function preventPretentiousPunctuation( event ) { if( event.key.length != 1 ) return; var code = event.key.codePointAt(0); var replacement = conversionMap[ code ]; if( replacement ) { event.preventDefault(); document.execCommand( 'insertText', 0, replacement ); } } 

感谢戴的答案大纲。 不幸的是,当我们在iOS 11设备上实现他们的解决方案并进行测试时,我们发现keypress事件监听器根本没有触发。 我们使用input事件和正则表达式字符串替换重新设计了他们的解决方案,发现这对我们有效。

这是我们的变体,使用jQuery作为选择器和更短的替换列表。

  

添加作为答案,因为我没有代表评论。