简体   繁体   English

发送URL请求,不离开页面

[英]send URL request, without leaving page

I have a web-page, with a streaming web-camera. 我有一个网页,带有流媒体网络摄像头。 The camera pans and tilts, using a script on the camera's internal web-server. 使用摄像机内部Web服务器上的脚本来摇摄和倾斜摄像机。 I cannot modify the script, its output, is a web-page that says "OK". 我无法修改脚本,其输出是一个显示“确定”的网页。

When a user comes to my page, I want them to be able to use arrow keys to pan the camera, but not have the script that sends out the request, leave the page with the camera stream. 当用户来到我的页面时,我希望他们能够使用箭头键来平移摄像机,但没有发出请求的脚本,而是将页面与摄像机流一起保留。 This source, will pan the camera, but you have to click back, to get to the stream. 此源将平移相机,但您必须单击返回以进入流。 here is my source: 这是我的资料来源:

<head>
    <?php
    $url = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=2";
    ?>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).keypress(function (e){ 
    if(e.keyCode == 37) // left arrow
    {
    window.location.href = <?php echo "\"" . $url . "\""; ?>; 
    }

    else if(e.keyCode == 38)    // up arrow
    { 
$(window.location.href = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=6"); 
    }

    else if(e.keyCode == 39)    // right arrow
    { 
    window.location.href = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=4";  

    }

    else if(e.keyCode == 40)    // Down arrow
    { 
    window.location.href = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=0";      
    }
});
</script>
<title>Navigation</title>
</head>
<body>
<br><h2>use arrows to navigate.</h2> 
<iframe src="http://Camera-server-IP/videostream.cgi?user=user&pwd=Password" width="330" height="260"></iframe>
</body>
</html>

Camera-server-IP is the actual Camera Webserver address. Camera-server-IP是实际的Camera Web服务器地址。 Why is every navigation arrow done differently? 为什么每个导航箭头的操作方式都不一样? because I'm trying to figure this out. 因为我正在尝试解决这个问题。

what can I do to use the arrow keys to send the url requests to the camera, but simultaneously stay on the page where the camera is streaming? 如何使用箭头键将网址请求发送到相机,但同时停留在相机正在流式传输的页面上?

The page is moving forward because you are setting the window location to the new link. 该页面正在前进,因为您正在将窗口位置设置为新链接。 What you want to do is use AJAX to make the call which should leave you on your current page afterwards. 您要做的是使用AJAX拨打电话,此后应将您留在当前页面上。 JQuery is not required for this, but would make things much easier for you. JQuery不是必需的,但是它将使您更轻松。

Example using Jquery: 使用Jquery的示例:

if(e.keyCode == 38)    // up arrow
{ 
    $.get("http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=6", function() {
        //on successful call
    });
}

You can see more info on requests using jquery at https://api.jquery.com/jquery.get/ 您可以在https://api.jquery.com/jquery.get/上查看有关使用jquery的请求的更多信息。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM