如何使用 Javascript 将字符发送到文本输入

Question

在我的项目中：CSSHTML Keyboard 我已经根据我的旧笔记本电脑键盘设置了一个键盘，这是我作为学校家庭作业制作的一个小项目。问题是，我不确定如何将特定字符添加到键盘，例如：假设我单击 Shift 然后单击 A/a，我想要它在输入中放置“A”。如果有人可以为此提供一些信息，我将不胜感激。另外对于以后的通知，我并没有试图让 Every 键像它应该的那样工作，只有基本键（字母、数字、大写、设置符号、大写锁定、Shift、空格和退格键）

我做了一个计算器：Simple Calculator 我尝试使用类似的方法将符号/字符发送到输入，但似乎效果不佳。

我尝试的方法是使用输入：

<input id="butn" class="output" type="textfield" name="ans" value="!The 
Text input is Currently Not Available!"></input>

然后使用少量 Javascript 将数学方程式从按钮发送到表单，然后发送到输入，然后使用求值 Javascript sn-p 求解它们

这里是当前代码的链接：CSSHTML Keyboard Finished

顺便说一句，如果键盘采用“胶带和胶水”样式组合在一起，我深表歉意，我对完善 CSS 大小和对齐仍然很陌生，所以现在我手动编写所有内容，并设置边距和大小。

在测试了我使用的上述计算器方法一段时间后，我设法让它在某个时候工作，但它未定义，所以在某种程度上我暂时放弃了这个项目，无论哪种方式, 我对我的成品很满意，即使我不能用它来输入字符。

Answer 1

你可以添加这个简单的JS来获取keydown事件，获取按下的键的值并打印在输入中。

然后你应该配置你在键入时不想写的键（例如特殊操作）

我已经为您提供了退格键和一些示例键。

var output = document.querySelector('.output');

addEventListener('keydown', function(e) {
    e.preventDefault();     

    // Backspace 
    if ( e.key === 'Backspace' ){
        output.value = output.value.substr( 0, ( output.value.length -1 ) );    

    // The values you dont want to write literally
    } else if( e.key === 'Shift'     || 
               e.key === 'Control'   ||
               e.key === 'Alt'       ||
               e.key === 'AltGraph'   ) {

        output.value += '';

    }   else {
        // The keydown values
        output.value += e.key;
    }   
});

补充

关于如何通过按钮发送值的问题：

首先你必须设置“一些东西”以便用 js 选择它们（例如一个类）， 你应该设置一个值属性你以后得到它。

<button type="button" class="letter keys" value="1" >!<br>1</button>

然后选择所有带有循环的按钮并在单击它们时添加一个事件。

最后只需获取元素的 attributes.value 并用它做你想做的事。

这是一个例子：

var buttons = document.querySelectorAll('.letter');

for( let button of buttons ){
    button.addEventListener('click',function(e){
        console.log(button.attributes.value);       
    })
}

这对你有用，但我建议你阅读更多关于 JS 基础知识的内容，以便在此之前管理你想做的所有事情，因为这只是开始。

希望对你有帮助。