Question

这可能很简单，但谷歌搜索并没有帮助我。所以我有一个连接到网络的机器人，它响应URL上的查询，例如http://172.16.0.1:8001/web/Speed?Speed1=100

我想做的就是制作一些简单的按钮，这些按钮会发送这些查询，但不会离开页面。目前我有以下HTML可用，但每次按下按钮都会转到相关网址并离开主页面。

<!DOCTYPE html>
<html>
    <body>

    <strong>MyRIO Robot Controller</strong>


    <input type=button onClick="parent.location='http://172.16.0.1:8001/web/connect?Connect=1'" value='Start Control'>
    <input type=button onClick="parent.location='http://172.16.0.1:8001/web/connect?Connect=0'" value='Stop Control'>
    <input type=button onClick="parent.location='http://172.16.0.1:8001/web/Speed?Speed1=100'" value='Full Speed'>
    <input type=button onClick="parent.location='http://172.16.0.1:8001/web/Speed?Speed1=50'" value='Half Speed'>
    <input type=button onClick="parent.location='http://172.16.0.1:8001/web/Speed?Speed1=00'" value='Stop'>

    </body>
</html>

Answer 1

所以AJAX似乎并不难以学习。对于其他任何有这个问题的人来说，这就是我提出的解决方案

<!DOCTYPE html>
<html>
<head>
<script>
    function startControl()
    {
        var xmlhttp;
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
            }
        }

        xmlhttp.open("GET","http://172.16.0.1:8001/web/connect?Connect=1",true);
        xmlhttp.send();
    }
    function stopControl()
    {
        var xmlhttp;
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
            }
        }

        xmlhttp.open("GET","http://172.16.0.1:8001/web/connect?Connect=0",true);
        xmlhttp.send();
    }
</script>
</head>
<body>

<h2>MyRIO Robot Controller</h2>
<button type="button" onclick="startControl()">Start Control</button>
<button type="button" onclick="stopControl()">Stop Control</button>
<div id="myDiv"></div>

停止我的HTML按钮离开页面

1 个答案: