如何使用虚拟键盘写入焦点输入？

Question

我完成了一个教程，为我不希望使用 chrome o/s 键盘的应用程序创建虚拟键盘。该教程很棒，jquery 比我预期的要简单得多。但是，它只是使用 id 作为选择器写入文本输入。我想让它直接输入一个重点输入。我一直无法找到实现这一目标的方法。有人可以帮忙吗？

这是脚本：

 $(function(){
var $write = $('#write'),
    shift = false,
    capslock = false;

$('#keyboard li').click(function(){
    var $this = $(this),
        character = $this.html();


    if ($this.hasClass('left-shift') || $this.hasClass('right-shift')) {
        $('.letter').toggleClass('uppercase');
        $('.symbol span').toggle();

        shift = (shift === true) ? false : true;
        capslock = false;
        return false;
    }

            if ($this.hasClass('capslock')) {
        $('.letter').toggleClass('uppercase');
        capslock = true;
        return false;
    }

    if ($this.hasClass('delete')) {
        var html = $write.html();

        $write.html(html.substr(0, html.length - 1));
        return false;
    }


    if ($this.hasClass('symbol')) character = $('span:visible', $this).html();
    if ($this.hasClass('space')) character = ' ';
    if ($this.hasClass('tab')) character = "\t";
    if ($this.hasClass('return')) character = "\n";


    if ($this.hasClass('uppercase')) character = character.toUpperCase();


    if (shift === true) {
        $('.symbol span').toggle();
        if (capslock === false) $('.letter').toggleClass('uppercase');

        shift = false;
    }

    $write.html($write.html() + character);
});
});

我希望用户能够使用此键盘编辑许多输入，以下是这些输入的 html 标记：

    <input id="productC"  maxlength="3" class="menu" value="$8">
    <input id="priceCA" maxlength="3" class="menu" value="$10">
    <input id="priceCB" maxlength="3" class="menu" value="$8">
    <input id="priceCC" maxlength="3" class="menu" value="$12">

作为说明，我尝试将 $write 变量切换到菜单类。没用。

Answer 1

替换

$write.html($write.html() + character);

与

$(':focus').html($(':focus').html() + character);

$(':focus') jQuery 选择器将返回当前焦点元素。您还应该检查焦点元素是否是输入。