Fatal编程技术网
  • javascript/
  • HTML/Javascript：将键盘笔划输出到URL参数

HTML/Javascript：将键盘笔划输出到URL参数

javascript html arduino

HTML/Javascript：将键盘笔划输出到URL参数,javascript,html,arduino,url-parameters,keyboard-input,Javascript,Html,Arduino,Url Parameters,Keyboard Input,我将首先解释我的总体目标，然后是问题本身 总体目标： 向连接到路由器的Arduino板发送命令。计算机将通过wifi连接到路由器。Arduino将提供一个本地网站，计算机将使用该网站向Arduino发送按键。根据按键的不同，Arduino将以某种方式工作 向Arduino发送命令的一种方法是使用Arduino服务的网站URL末尾的参数。Arduino可以读取这些参数。我对此没有问题 Arduino能够为使用Javascript/HTML/CSS等编码的网站提供服务 问题: 我已经使用Javasc

我将首先解释我的总体目标，然后是问题本身

总体目标：

向连接到路由器的Arduino板发送命令。计算机将通过wifi连接到路由器。Arduino将提供一个本地网站，计算机将使用该网站向Arduino发送按键。根据按键的不同，Arduino将以某种方式工作

向Arduino发送命令的一种方法是使用Arduino服务的网站URL末尾的参数。Arduino可以读取这些参数。我对此没有问题

Arduino能够为使用Javascript/HTML/CSS等编码的网站提供服务

问题:

我已经使用Javascript一周了；但到目前为止，我有以下代码：

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript">


function Submit()
{
document.forms['myform'].submit();
}

document.onkeydown = function(event) {
var key_press = String.fromCharCode(event.keyCode);
var key_code = event.keyCode;
document.getElementById('kp').innerHTML = key_press;
    document.getElementById('kc').innerHTML = key_code;
var t=setTimeout("Submit()", 500);          
}


</script>
</head>


<form name='myform' method='GET'>

Key Pressed : <span id="kp" name="KP"></span>
<br />
Key Code : <span id="kc" name="KC"></span>


</form>
</html>


函数提交（）
{
document.forms['myform'].submit（）；
}
document.onkeydown=函数（事件）{
var key_press=String.fromCharCode（event.keyCode）；
var key_code=event.keyCode；
document.getElementById（'kp'）。innerHTML=key\u press；
document.getElementById（'kc'）。innerHTML=key\u代码；
var t=setTimeout（“Submit（）”，500）；
}
按键：


关键代码：
有了这个，我可以从我按下的键盘上看到按键的“按键代码”。网站将看到按键，输出按键代码和实际按键

我把set timeout函数放在那里，这样当我拿着一个键时，页面就会以较慢的、恒定的速率刷新

我知道HTML中的一些东西会自己创建和管理参数。例如，下拉框。据我所知，当下拉框被放入

<form method='GET'></form>
标记，则可以创建参数。文本框也会做同样的事情。然后，如果一个人“提交”网页，那么这些对象中的调整值将出现在URL的参数中

但是，我不知道如何将键代码的值输出到对象，然后提交页面以实时将值复制到URL参数

所谓实时：我的意思是在按下“up”键时继续发送命令，在释放时停止

我可以通过在文本框中键入一个字母，然后使用submit按钮将值输入URL参数，来实现这个粗略版本。我不能包括向上或向下箭头与此然而，我希望网页提交自己的实时

TLDR:如何使用键盘上的按键代码实时控制URL中的参数

非常感谢您阅读本文。非常感谢所有回复

编辑5/15/12网站董事会给了我一些有用的代码。以下是完整的新代码：

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript">


function Submit()
{  
document.forms['myform'].submit();
}

document.onkeydown = function(event) {
var key_press = String.fromCharCode(event.keyCode);
var key_code = event.keyCode;
document.getElementById('kp').innerHTML = key_press;

var t=setTimeout("Submit()", 500);          
}

</script>
</head>

<body onLoad='document.myform.KP.focus()'>
<form name='myform' method='GET' action="ENTER URL HERE">
Key Pressed : <input type="text" id="kp" name="KP"></span>

</form>
</body>
</html>


函数提交（）
{  
document.forms['myform'].submit（）；
}
document.onkeydown=函数（事件）{
var key_press=String.fromCharCode（event.keyCode）；
var key_code=event.keyCode；
document.getElementById（'kp'）。innerHTML=key\u press；
var t=setTimeout（“Submit（）”，500）；
}
按键：
我把网页的焦点放在文本框上。如果没有它，我必须点击文本框，然后代码将最终注册

这是如何执行的：当网页加载时，页面将自动聚焦在文本框上。它等待按键。按一个键：页面将在半秒钟后将参数的字母加载到URL（您可以使用setTimeout（）使其响应更快）。该键将保持在参数中，直到按下另一个键

我知道乞丐不能挑肥拣瘦，但我想让它表现出“电子游戏风格”，一个动作持续了很长时间，我按下一个键，而这个动作在我松开键的那一刻就停止了。在这种情况下，如果按住一个键，文本框将填充字母，然后提交。这是行不通的，因为我想让Arduino查找单个字符，而不是字符列表。然而，到目前为止，这真的很棒。我当然不会介意实施这个

然而，正如Tim所提到的，我一直在对套接字通信进行大量研究。这似乎是一条很好的途径，Arduino Ethernet Shield使用UDP库，到目前为止，我唯一的困难是设置客户端。Arduino是服务器。如果出现这种情况，我将进行编辑。

首先替换您的跨距：

<form name='myform' method='GET' action="scriptURL">
    Key Pressed : <input type="text" id="kp" name="KP"></span>
    <br />
    Key Code : <input type="text" id="kc" name="KC"></span>
</form>


按键：


关键代码：
（这将生成一个url，看起来像：scriptURL？KP=xxx&KC=yyy）

如果你想要一些非常轻的东西，那么：

<script>     
  document.onkeydown = function(event) {
    var key_press = String.fromCharCode(event.keyCode);
    var key_code = event.keyCode;
    document.getElementById('img').src = "scriptURL?KP=" + key_press + "&KC=" + key_code;
  }
</script>

<img src="scriptURL" id="img" style="display:none;"/>


document.onkeydown=函数（事件）{
var key_press=String.fromCharCode（event.keyCode）；
var key_code=event.keyCode；
document.getElementById（'img'）.src=“scriptURL？KP=“+key\u press+”&KC=“+key\u code；
}
无论返回的数据是什么，每次按键都会触发图像的重新加载（它是隐藏的）。服务器上的脚本将实时接收KP和KC参数。

提交页面时会遇到添加事件处理程序和侦听的问题。你可能想用Ajax、image src或iframe调用。尝试用这样的URL设置命令并不是实现你想要实现的通信的最简单的方法，我不认为。如果您的arduino连接到路由器，而不是让它服务于网页，那么创建一个可用于arduino和计算机之间通信的套接字可能会更容易。这将是一种简单得多的方式来发送你需要的信号，以实现你想要的实时反馈。谢谢epascarello和Tim，非常感谢你的回复。我对Ajax、image-src、iframe和socket通信知之甚少。所以在接下来的几天里，我有很多研究要做。当然，如果我通过你的主题找到一个可行的解决方案，我一定会编辑并发布我所做的。这很好！我是