0

我正在尝试用 jquery 模拟键盘事件。我想要的是当我单击一个按钮时，我希望一个字符出现在文本区域中。我需要动作是键盘模拟而不是简单的附加。我在网上尝试了所有可能的解决方案，但都没有成功，所以如果有人能帮助我，我将不胜感激。

这是我的 HTML/JS/Jquery 代码：

<html>
    <head></head>
    <body>
        <script type='text/javascript' src='jquery-1.9.1.min.js'></script>
        <input type='text' id="input"></input>
        <script type='text/javascript'>
            function simulateKeyPress() {
                document.getElementById("text").focus();
                var e = $.Event("keypress");
                e.which = 97;
                $("input").trigger(e);
            }
        </script>
        <br/>
        <button id="button" onclick='simulateKeyPress()'>Press Me</button>
    </body>
</html>

如您所见，单击按钮时，我只关注文本元素，但没有出现任何字符，有什么想法吗？

看起来我还不够清楚。这是另一个示例，我正在使用MouseTrap库来捕获键盘事件。这是我的代码。

<html>
<header>
<title>test</title>
</header>
<script type='text/javascript' src='MouseTrap.js'></script>
<script type='text/javascript' src='jquery-1.9.1.min.js'></script>

<body>
<input type='text' class="mousetrap" id="input"></input>
<script type='text/javascript'>
Mousetrap.bind('4',  function(){alert("you pressed 4" );});
function simulateKeyPress(character) {
        document.getElementById("input").focus();
        var input = $('#input');
        input.val(input.val() + character);
}
</script>
<br/>
<button type="button" onclick='simulateKeyPress(4)'>Press Me</button>
</body>
</html>

使用此代码，每当您在键盘上按“4”时，都会出现一个警告框。我想要的只是当我单击按钮时，要创建相同的事件。想法？

4

4 回答 4

1

这是模拟按键的一种解决方案：

var input = $('#input');

$('#button').click(function(){
    // Add a character to the input
    input.val(input.val() + 'x');
    // Trigger the keypress event
    input.keypress();
});

// Check if it work
input.on('keypress', function(){
    alert('key pressed!');
});

这是一个jsfiddle 演示。

于 2013-05-20T09:09:20.177 回答
1

当您从 javascript 触发 Javascript 时，Javascript 不会执行默认操作。所以唯一的方法是创建你自己的发泄处理程序：

function simulateKeyPress() {
    document.getElementById("text").focus();
    var e = $.Event("keypress");
    e.which = 97;
    $("input").trigger(e);
}

$("input").on('keypress', function(e){
    //append e.which to your input here
});
于 2013-05-20T09:15:51.503 回答
0

如果不手动将字符附加到文本区域，似乎不可能实现这一点。

@HighKickX 和 @claustrofob 编写的答案仅触发事件处理程序，就好像按下了指定的键一样，但实际上并没有像按下键盘上的键时那样按下该键（可能是出于安全原因）。

因为只触发了事件但实际上并未按下键，所以 textarea 不会自动添加该字符。

于 2013-08-04T08:55:06.200 回答
0

尝试这个

<input id="field">

<button id="x" class="button">submit</button>

$(".button").click(function() {

   var value = $("#field").val();

   $("#field").val( $("#field").val() + value);

});
于 2013-08-28T09:10:38.207 回答