时间戳

首页 > 解决方案 > 如何在没有变音符号转换的情况下读取类型为 email 的输入字段的原始值？

javascript - 如何在没有变音符号转换的情况下读取类型为 email 的输入字段的原始值？

问题描述

我的页面上有一个 html 输入元素，用户可以在其中输入他的电子邮件地址：

<input type="email" id="yourEmail" name="yourEmail">

我不直接通过表单发送此字段，而是使用 javascript 将其读入变量，如下所示：

let email = document.getElementById('yourEmail').value.trim();

现在这适用于普通电子邮件，但只要我有像德语变音符号这样的特殊字符，我就会在 javascript 变量中获得转录的电子邮件。mail@gründlicher.de例如，如果我输入， js 变量包含 value mail@xn--grndlicher-beb.de。由于我想在发送数据之前在摘要页面上将这些数据显示给用户，这让用户感到非常困惑 - 感觉好像有些东西坏了（至少如果你不是技术宅，了解会发生什么）。

现在我想知道：如何获取用户实际输入的文本，而不是转录的电子邮件？显然我可以将表单更改type="email"为type="text"，但随后我也会在移动设备上松开电子邮件专用键盘，这是我想要的。

标签： javascripthtmlemail-address

解决方案

尝试使用type="text"获取要显示的特殊字符，然后使用inputmode="email"允许移动设备上的电子邮件专用键盘：

document.getElementById('yourEmail').addEventListener('change', function() {
  console.log(this.value);
});
<input type="text" inputmode="email" id="yourEmail" name="yourEmail">

推荐阅读