Javascript 使用querySelector获取用户输入的每个字母

试图制作一个网页，让用户输入每个字母，然后以拼音字母输出。例如（用户类型：Hello）（输出：Hotel、Echo、Lima、Lima、Oscar）。这就是我到目前为止所做的，只是需要一些关于如何获取每个字母的值并将其与数组进行比较以获得输出的指导

//define UI variables
const userInput = document.querySelector('#input');
const phoneticAlphabet = ["Alpha"," Bravo","Charlie"];

//load all event listeners
loadEventListeners();

function loadEventListeners() {
  //add submit event 
  form.addEventListener('submit', submitInput);
}

//submit user input
function submitInput(e) {

  console.log(userInput.value);
  if (userInput.value === '') {
    alert('Add Input');
  } 
  e.preventDefault();
}

---

您可以使用字段的

keydown

事件上的

key

属性来获取按下的字符

然后使用

key.length==1

（）检查密钥是否为可打印密钥

如果密钥可打印，请将其转换为大写，然后使用转换为字符代码，然后从中减去65（字符

A

）。这将为您提供数组中的索引

如果此索引在数组的边界内，请访问数组并打印字符

const拼音字母表=['Alpha'、'Bravo'、'Charlie'、'Delta'、'Echo'、'Foxtrot'、'Golf'、'Hotel'、'India'、'Juliet'、'Kilo'、'Lima'、'Mike'、'seven'、'Oscar'、'Papa'、'Quebec'、'Romeo'、'Sierra'、'Tango'、'Uniform'、'Victor'、'Victor'、'wisky'、'X-ray'、'yanke'、'Zulu'；
document.querySelector（“#input”）.addEventListener（'keydown'，e=>{
常量isPrintable=e.key.length==1；
console.clear（）；
如果（可打印）{
const idx=e.key.toUpperCase（）.charCodeAt（0）-65；
if（idx>=0&&idx<拼音字母表长度）{
常量音素=拼音字母[idx]；
console.log（音素）；
}
}
});
我假定您希望替换输入中的不可转换字符。同样，我使用正则表达式。我还在“p”标签中添加了响应。代码在单击“提交”时运行

更新：
扩展了所有字母的我的数组：）

更新2:
感谢@CharlieBatista指出这一点。现在，输入也接受大写字符


//定义UI变量
const form=document.拼音形式；
const userInput=document.querySelector（“#input”）；
const output=document.querySelector（“#output”）；
const拼音字母表=['Alpha'，'Bravo'，'Charlie'，'Delta'，'Echo'，'Foxtrot'，'Golf'，'Hotel'，'India'，'Juliet'，'Kilo'，'Lima'，'Mike'，'seven'，'Oscar'，'Papa'，'Quebec'，'Romeo'，'Sierra'，'Tango'，'Uniform'，'Victor'，'wicky'，'X-ray'，'yanke'，'Zulu等]；
//加载所有事件侦听器
loadEventListeners（）；
函数loadEventListeners（）{
//添加提交事件
表格.附录列表（提交、提交）；
}
//提交用户输入
函数submitInput（e）{
e、 预防默认值（）；
var值=userInput.value；
如果（值==''）{
警报（“添加输入”）；
}否则{
值=值。替换（/[^a-zA-Z]/gi，”）；
userInput.value=值；
value=value.toLowerCase（）；
var outputArr=[]；
对于（变量i=0；i


您知道它为什么不接受大写字母吗？谢谢你的帮助help@CharlieBatista我用“键码”减去97来猜测索引。所以，为了过程的一致性，我决定将字符串转换成小写。另一种方法是，如果字符是小写或大写，则首先添加一个检查，然后减去65（大写）或97（小写）。@CharlieBatista你是对的。有一只虫子。我已经更新了我的答案。请查看。谢谢你的帮助