我的 HTML 文档中有一个脚本,它检测何时检测到箭头键之一,然后它会更改 iframe 的 URL。释放键时,iframe 将再次更改。
这有效,除非在按住键期间它会不断重复操作以设置 iframe 的 url。
有没有办法,当它被按住时,它只会改变 iframe url 一次?然后当它发布时它会改变网址?
额外: 我创建了一个页面来通过网络控制遥控车。除了这个问题,它工作得很好。基本上,它将 iframe url 更改为 PHP 页面,每个箭头键都有一个不同的 get 变量。然后 PHP 页面使用 PHP Serial 根据从 iframe 发送的变量(使用 GET)将数据发送到串行端口。
谢谢你的帮助!!!
编辑:这是汽车的照片。http://oi41.tinypic.com/21cimms.jpg
编辑 2
继承人 index.html
<!doctype html>
<html lang="en">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
function pause(ms) {
ms += new Date().getTime();
while (new Date() < ms){}
}
var keyBeingHeld = new Array();
keyBeingHeld[0] = false;//left
keyBeingHeld[1] = false;//right
keyBeingHeld[2] = false;//up
keyBeingHeld[3] = false;//down
function setControllerState(action){
leftPressState="up";
rightPressState="up";
upPressState="up";
downPressState="up";
if (keyBeingHeld[0]){
leftPressState="down";
}
if (keyBeingHeld[1]){
rightPressState="down";
}
if (keyBeingHeld[2]){
upPressState="down";
}
if (keyBeingHeld[3]){
downPressState="down";
}
var stateStr = "?upPressState="+upPressState+"&downPressState="+downPressState+"&leftPressState="+leftPressState+"&rightPressState="+rightPressState;
iframe = document.getElementById('stateFrame');
iframe.src = "BackEnd.php"+stateStr+"&action="+action;
}
$(document).keydown(function(event) {
if (!event) var event = window.event;
switch (event.keyCode) {
case 37:
if (!keyBeingHeld[0]){
keyBeingHeld[0] = true;
setControllerState ("leftArrowPress");
}
break;
case 38:
if (!keyBeingHeld[2]){
keyBeingHeld[2] = true;
setControllerState ("upArrowPress");
}
break;
case 39:
if (!keyBeingHeld[1]){
keyBeingHeld[1] = true;
setControllerState ("rightArrowPress");
}
break;
case 40:
if (!keyBeingHeld[3]){
keyBeingHeld[3] = true;
setControllerState ("downArrowPress");
}
break;
}
});
$(document).keyup(function(event) {
if (!event) var event = window.event;
switch (event.keyCode) {
case 37:
if (keyBeingHeld[0]){
keyBeingHeld[0] = false;
setControllerState ("leftArrowRelease");
}
break;
case 38:
if (keyBeingHeld[2]){
keyBeingHeld[2] = false;
setControllerState ("upArrowRelease");
}
break;
case 39:
if (keyBeingHeld[1]){
keyBeingHeld[1] = false;
setControllerState ("rightArrowRelease");
}
break;
case 40:
if (keyBeingHeld[3]){
keyBeingHeld[3] = false;
setControllerState ("downArrowRelease");
}
break;
}
});
</script>
</head>
<body>
<p>Press one of the arrow keys.</p>
<iframe id="stateFrame" name="stateFrame" style="width:160px;height:180px;" src="BackEnd.php?upPressState=up&downPressState=up&leftPressState=up&downPressState=up&action=none"></iframe>
<p>Thanks vdbuilder!</p>
</body>
</html>
这是后端.php
<?php
$opened = false;
$upPressState = cleanupSpecialChars($_GET['upPressState']) or $upPressState = 'up';
$downPressState = cleanupSpecialChars($_GET['downPressState']) or $downPressState = 'up';
$leftPressState = cleanupSpecialChars($_GET['leftPressState']) or $leftPressState = 'up';
$rightPressState = cleanupSpecialChars($_GET['rightPressState']) or $rightPressState = 'up';
$action = cleanupSpecialChars($_GET['action']) or $action = 'none';
// build your message from states and action, and send to serial port here
//the rest is to display the state
$pressedColor = "bbffbb";
$releasedColor = "bbbbbb";
$upArrowColor = $releasedColor;
$downArrowColor = $releasedColor;
$leftArrowColor = $releasedColor;
$rightArrowColor = $releasedColor;
if($upPressState == "down"){
sendCMD(25);
$upArrowColor = $pressedColor;
}
if($downPressState == "down"){
sendCMD(24);
$downArrowColor = $pressedColor;
}
if($leftPressState == "down"){
sendCMD(28);
$leftArrowColor = $pressedColor;
}
if($rightPressState == "down"){
sendCMD(29);
$rightArrowColor = $pressedColor;
}
//--- Up
if($upPressState == "up"){
sendCMD(15);
$upArrowColor = $releasedColor;
}
if($downPressState == "up"){
sendCMD(14);
$downArrowColor = $releasedColor;
}
if($leftPressState == "up"){
sendCMD(18);
$leftArrowColor = $releasedColor;
}
if($rightPressState == "up"){
sendCMD(19);
$rightArrowColor = $releasedColor;
}
echo("<html><head><style>");
echo("body{background-color:#000000;}
div#container{position:absolute;left:10px;top:10px;background-color:#eeeeee;
font-size:20px;padding:20px;width:100px;height:92px;text-align:center;}
div.arrow{position:absolute;width:30px;padding-top:2px;padding-bottom:2px;}
div#upArrow{left:55px;top:20px;background-color:#".$upArrowColor.";}
div#downArrow{left:55px;top:82px;background-color:#".$downArrowColor.";}
div#leftArrow{left:20px;top:50px;background-color:#".$leftArrowColor.";}
div#rightArrow{left:90px;top:50px;background-color:#".$rightArrowColor.";}
div#lastAction{position:absolute;left:0px;bottom:2px;font-size:14px;color:#ffffee;}");
echo("</style></head><body>");
echo("<div id='container'>
<div class='arrow' id='upArrow'>↑</div><div class='arrow' id='downArrow'>↓</div>
<div class='arrow' id='leftArrow'>←</div><div class='arrow' id='rightArrow'>→</div>
</div><div id='lastAction'>Last Action:<br />".$action."</div>");
echo("</body></html>");
//cleanup input
function cleanupSpecialChars($inStr){
$tempStr = htmlentities(stripslashes($inStr));
$retStr = str_replace(array('\\','/'), '', $tempStr);
return $retStr;
}
function sendCMD($cmd){
if($opened == false){
$fp =fopen("com4", "wb");
}
fwrite($fp,$cmd);
fclose($fp);
}
?>