我目前正在开发一个计时系统项目,员工可以走到触摸屏计算机(或平板电脑)前输入他或她的 4 位员工编号并打卡。
现在我对 JQuery 不是很好,所以我找到了关于如何创建 JQuery 键盘的教程,当按下按钮时填充 TextArea 字段。
这对我来说非常有用,我已经能够通过使用本教程和一些 php 来处理表单来实现我想要的。
我遇到的问题是 JQuery 键盘填充了一个文本区域,我真的需要它来填充一个输入字段。看起来这应该是一件相当简单的改变,但我一生都无法弄清楚。
我的 HTML 表单
<form action="index.php" method="post">
<textarea id="write" name="code" rows="6" cols="60"></textarea>
<ul id="keyboard">
<li class="symbol"><span class="off">1</span></li>
<li class="symbol"><span class="off">2</span></li>
<li class="symbol"><span class="off">3</span></li><br /><br /><br />
<li class="symbol"><span class="off">4</span></li>
<li class="symbol"><span class="off">5</span></li>
<li class="symbol"><span class="off">6</span></li><br /><br /><br />
<li class="symbol"><span class="off">7</span></li>
<li class="symbol"><span class="off">8</span></li>
<li class="symbol"><span class="off">9</span></li><br /><br /><br />
<li class="symbol-zero"><span class="off">0</span></li>
<li class="delete">Clear</li>
</ul>
<input class="submit-in" type="submit" name="clock" value="In">
<input class="submit-out" type="submit" name="clock" value="Out">
</form>
用于键盘的 JQuery
$(function(){
var $write = $('#write'),
shift = false,
capslock = false;
$('#keyboard li').click(function(){
var $this = $(this),
character = $this.html(); // If it's a lowercase letter, nothing happens to this variable
// Delete
if ($this.hasClass('delete')) {
var html = $write.html();
$write.html(html.substr(0, html.length - 999));
return false;
}
// Special characters
if ($this.hasClass('symbol')) character = $('span:visible', $this).html();
if ($this.hasClass('symbol-zero')) character = $('span:visible', $this).html();
if ($this.hasClass('space')) character = ' ';
if ($this.hasClass('tab')) character = "\t";
if ($this.hasClass('return')) character = "\n";
// Add the character
$write.html($write.html() + character); }); });
任何帮助都将不胜感激,就像我说我是 JQuery 的菜鸟,我希望有一个快速简便的解决方案。
谢谢大家。