Javascript 在最后一个焦点输入字段内输入div值

我有一个用HTML和CSS构建的键盘，我正试图弄清楚按下时如何输入一个键（div）字母。我需要把这些字母放在最后一个聚焦的输入字段中

这就是a目前所拥有的：

//Here I enter the characters (key letters) in the last focused field
$("div.key").click(function(e) {

    //Here I get the last focus
    var lastFocused;
    lastFocused = $('#registration-area').find('input.item').focus();

    //Here I enter the pressed keys
    var current_text = lastFocused.val();
    var cursor_position = lastFocused.selectionStart;
    var new_text = $(this).text();
    current_text = [current_text.slice(0, cursor_position), new_text, current_text.slice(cursor_position)].join('');
    lastFocused.val(current_text);
    lastFocused.focus();

});

这是HTML的一部分：

<input id="firstName" name="firstName" type="text" required/>
<input id="lastName" name="lastName" type="text" required/>

<div class="row">
    <div class="key-row" style="width: 1040px;">
        <div id="k-a" class="key key-btn">a</div>
        <div id="k-s" class="key key-btn">s</div>
        <div id="k-d" class="key key-btn">d</div>
        <div id="k-f" class="key key-btn">f</div>
        <div id="k-g" class="key key-btn">g</div>
        <div id="k-h" class="key key-btn">h</div>
        <div id="k-j" class="key key-btn">j</div>
        <div id="k-k" class="key key-btn">k</div>
        <div id="k-l" class="key key-btn">l</div>
        <div id="k-ñ" class="key key-btn">ñ</div>
    </div>
</div>

A.
s
D
F
G
H
J
K
L
ñ

---

如果有人能告诉我我做错了什么，我会非常感激的。

我想这里的问题是在“记忆”中保留最后聚焦的区域是什么

lastFocused = $('#registration-area').find('input.item').focus();

上面这一行实际上将聚焦集合中的第一个

。项

。。。而不是让你得到最后一个“以前”聚焦的。这是第一个问题

我建议您删除«此处我得到最后一个焦点»部分，这是错误的（在单击处理程序之外）：

然后，假设下面的函数中剩下的部分正在工作。。。（关于光标位置…我不确定…）：

---

试试看

这是基本解决方案，请检查并根据您的需要进行更新/编辑/更改/验证

var；
$（“.item”）.focusout（函数（e）{
lastFocused=e.target；
});
//在这里，我在最后一个焦点字段中输入字符（关键字母）
$（“div.key”）。单击（函数（e）{
//我在这里输入按下的键
var current_text=lastFocused.value；
console.log（'1:'+当前文本）；
var cursor\u position=current\u text.length；//lastFocused.selectionStart；
//在这里，我只是计算当前值长度而不是选择开始修复添加新字符到输入正确的位置输入电子邮件类型
var new_text=$（this.text（）；
当前文本=[当前文本.slice（0，光标位置），新文本，当前文本.slice（光标位置）]。连接（“”）；
lastFocused.value=当前文本；
lastFocused.focus（）；
});

A.
s
D
F
G
H
J
K
L
ñ
您能在代码中添加html部分吗？当然可以。我已经更新了我的问题：）你的jQuery对象，由
$（“#注册区域”）组成。find（'input.item'）
至少包含两个不在你发布的HTML中的元素，我既看不到
id=“registration area”
元素，也看不到
元素。你的答案很完美。谢谢只有一件事，当出于某种奇怪的原因使用input type=“email”时，它会向后输入字符。我必须改变什么吗？请现在检查，我做了一些小的改变，你可以根据你的需要调整更多。谢谢完美的谢谢
var lastFocused;
$('#registration-area input.item').on('focus',function(){
  lastFocused = $(this);
});

$("div.key").click(function(e) {
  var current_text = lastFocused.val();
  var cursor_position = lastFocused.selectionStart;
  var new_text = $(this).text();
  current_text = [current_text.slice(0, cursor_position), new_text, current_text.slice(cursor_position)].join('');
  lastFocused.val(current_text);
  lastFocused.focus();
});