Question

我一直在网上搜索有关如何使用html代码创建自己的小键盘的一些提示，以充当计算机上的小键盘。

我的网站上有这个小键盘，可以输入同一div中的文本字段。我给每个按钮一个值，现在我想我必须创建更多的东西，以便数字将添加到我的文本字段。

我真的是编程的初学者，所以也许这很容易。谢谢你的帮助！

Answer 1

你需要的是学习javascript。使用javascript，您将能够编写代码来执行此操作。

<script>

   function AddValueToTextField(val)
   {
      document.getElementByID( <textfiled ID> ).value += val;
   }

</script>

<button onClick="AddValueToTextField(this.value)"></button>

这只是非常基本的，但它只是对所需内容的粗略概念，按钮设置为在单击时调用函数“AddValueToTextField”。调用该函数时，按钮的值随之一起发送。在函数内部，它获取文本字段上的句柄，并将按钮的值添加到已存在的任何内容中，我建议查看：

http://www.w3schools.com/js/

作为开始学习javascript的地方。

Answer 2

你可以用jQuery来做。如果你需要一个简单易用的解决方案（jQuery通常更容易和更快），jQuery是更好的恕我直言。

HTML：

<div id="myDiv"> </div> //the div to which we add text

<div id="buttonContainer">           //this is the div containing the numbers (the numpad)
<button value="one"> one </button>
<button value="two"> two </button> 
</div>

jQuery的：

$("#buttonContainer button").click(function() {
   $("#myDiv").append($(this).val());
});

http://jsfiddle.net/DLzUU/1/

这样做是：当你点击id为'buttonContainer'的div中的任何按钮时，它会将其值添加到id为“myDiv”的div中。

关于Javascript主题，如果你想要一个非常好的指南：http://javascript.info/

Answer 3

你可以尝试http://keith-wood.name/keypad.html keypad example，这是一个很棒的例子

Answer 4

$(document).ready(function(){
var selected;
$(".admin_loginid input").focus(function(){
    selected = $(this);
});

$(".loginbtn").click(function(){
    selected.val(selected.val() + $(this).val());
});

});

解决了这个问题并且效果非常好，感谢您的帮助！现在我选择的输入框从我创建的小键盘中获取输入。

使用输入创建自己的小键盘

4 个答案: