Question

我想在输入框中显示按键onclick数据。请帮忙。

$('.keypress').click(function(e) {
  var code = $(this).data('code');
  $('#input').trigger(
    jQuery.Event('keypress', {
      keyCode: code,
      which: code
    })
  );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<p><label>input: <input type="text" name="foo" id="input" value="" /></label></p>

<p>
  <button class="keydown" data-code="13">Trigger keydown Enter</button>
  <button class="keypress" data-code="13">Trigger keypress Enter</button>
  <button class="keyup" data-code="13">Trigger keyup Enter</button>
</p>

<p>
  <button class="keydown" data-code="65">Trigger keydown 'a'</button>
  <button class="keypress" data-code="65">Trigger keypress 'a'</button>
  <button class="keyup" data-code="65">Trigger keyup 'a'</button>
</p>

以下是代码：https://jsfiddle.net/rickj33/3fby0nzr/

Answer 1

只需执行以下操作：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<p><label>input: <input type="text" name="foo" id="input" value="" /></label></p>

<p>
  <button class="keydown" data-code="13">Trigger keydown Enter</button>
  <button class="keypress" data-code="13">Trigger keypress Enter</button>
  <button class="keyup" data-code="13">Trigger keyup Enter</button>
</p>

<p>
  <button class="keydown" data-code="65">Trigger keydown 'a'</button>
  <button class="keypress" data-code="65">Trigger keypress 'a'</button>
  <button class="keyup" data-code="65">Trigger keyup 'a'</button>
</p>

{{1}}

Answer 2

您要的只是在输入框中显示代码（使用data属性绑定）。因此，您可以按照以下步骤简单地进行操作。

$('.keypress').click(function(e) {
   var code = $(this).data('code');
   $('#input').val(code);                
});

使用jQuery触发输入的按键

2 个答案: