0

我目前正在开发一个计时系统项目,员工可以走到触摸屏计算机(或平板电脑)前输入他或她的 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 的菜鸟,我希望有一个快速简便的解决方案。

谢谢大家。

4

2 回答 2

0

更改<textarea id="write" name="code" rows="6" cols="60"></textarea><input type="text" id="write" name="code" />

将所有实例替换$write.html$write.val

于 2012-03-15T14:42:29.833 回答
0

输入字段中的文本不是 html,因此您不能使用 .html() 对其进行分配,以使用您应该更改的文本填充输入字段

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

对此。

$write.attr('value', $write.attr('value') + character);

或者简单地使用 .val() 如之前的海报所述,这是 jQuery 方式。

于 2012-03-15T14:45:09.753 回答