javascript - 使表单在 keydown 事件上可见,然后聚焦并清除输入字段

标签 javascript jquery html forms

我有一个表格,其中的单元格接受键盘事件。我还有一个最初隐藏的表格。我想要一个键事件来显示表单并聚焦在输入字段上,但是当我这样做时,触发该事件的键值出现在输入字段中 - 我怎么能不显示这个字符呢? (例如,按“x”,表单的文本字段中将显示“x” - 我希望该字段为空)。

CSS

table.thistbl td {
  border: 2px solid black;
  width: 20px;
  height: 20px;
  padding: 5px;
}

#formid {
  display: none;
  position: absolute;
  width: 300px;
  height: 40px;
  left: 20px;
  top: 60px;
  background-color: #CCC;
}

JavaScript/jQuery:

$(function() {

  $('#tablediv').on('keydown', 'td', function(e) {
      $('#formid').show();
      $('#inputid').focus();
  });

});

HTML:

<div id="tablediv">
<table class="thistbl">
  <tr>
    <td tabindex="0"></td>
    <td tabindex="0"></td>
    <td tabindex="0"></td>
  </tr>
</table>
</div>

<form id="formid">
  <input type="text" tabindex="1" id="inputid" />
</form>

Fiddle

最佳答案

尝试使用 keyup 而不是 keydown

Fiddle here

关于javascript - 使表单在 keydown 事件上可见,然后聚焦并清除输入字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31317920/

相关文章:

javascript - 一些 bootstrap 轮播图像无法在 safari mac 上加载

PHP MYSQL 允许用户从文本区域提交链接

javascript - 你为什么要把/* 放在你的 jQuery 函数周围?

javascript - Backbone.js - 排序和迭代 - 比较器不起作用

javascript - 如何为 Highcharts 中每个系列堆叠的水平条添加页脚?

jquery - 在 jQuery 中动画前缀 CSS 规则

javascript - 使用 Javascript 在 HTML 页面上隐藏按钮的最佳方法

jQuery UI Datepicker onchange 事件问题

jquery - 获取有关由 jquery 创建的 vouchsafe 元素的信息

html - CSS - 使图像适合特定大小的 div