编辑

Question

您好，我可能还有一段路要走，所以请告诉我是否有更好的方法，但是我有一些tasmoto sonoff设备，并且我在按钮上有此代码链接，可以打开和关闭灯光

http://192.168.1.126/cm?cmnd=Power%20toggle'“ />

现在，当我这样做时，我会从命令中获取输出，我想我也不会显示输出作为状态来知道指示灯的状态，但是输出也显示在不同的页面，所以我还不能在屏幕上将其用作按钮

HTML代码我知道它是错误的，我该如何解决它

    <html>
    <body>

    <form>
        <input class="MyButton" type="button" value="Office Toggle" onclick="window.location.href='http://192.168.1.126/cm?cmnd=Power%20toggle'" />
        <br>
        <input class="MyButton" type="button" value="Fishtank Toggle" onclick="window.location.href='http://192.168.1.128/cm?cmnd=Power%20toggle'" />


    </form>




}


    </body>
        function togglelight() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      console.log(this.responseText); //To check output while error[Optional]
    }
  };
  xhttp.open("GET", "http://192.168.1.126/cm?cmnd=Power%20toggle", true);
  xhttp.send();

    </html>

Answer 1

更新（更有用）：您需要使用AJAX打开而不重定向到输出

根据您的要求

var status;

function togglelight(btn, lastip) {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      status = this.responseText;
      console.log(status); //To check output [Optional]

      if (status.localeCompare("on")) {
        btn.classList.add("on");
      } else {
        btn.classList.remove("on");
      }
    }
  };
  // You need to used this
  // xhttp.open("GET", "http://192.168.1."+lastip+"/cm?cmnd=Power%20toggle", true); 

  // For Stack overflow Test only
  xhttp.open("GET", "https://raw.githubusercontent.com/limitbrk/Test/master/lighttoggle.txt", true);

  xhttp.send();
}

input.on {
  background-color: #88ff88;
}

input:not(.on) {
  background-color: #ff8888;
}

<input class="MyButton" type="button" value="Office Toggle" onclick="togglelight(this,126)" />
<br>
<input class="MyButton" type="button" value="Fishtank Toggle" onclick="togglelight(this,128)" />

对不起，旧答案与您的问题不符

使用POST方法

请参见different of POST vs GET methods

    <form method="post" action="http://192.168.1.126/cm">
      <input name="cmnd" value="Power toggle">
      <input type="submit">
    </form>

Answer 2

JavaScript ajax调用听起来像您想要的。它们允许页面实质上被加载而无需加载到您的浏览器。您还可以对将要加载的内容执行操作，因为脚本可以使调用进行访问。一些不错的纯JavaScript ajax代码：

How to make an AJAX call without jQuery?

    <html>
    <body>

    <form>
        <input class="MyButton" type="button" value="Office Toggle" onclick="togglelight('126')" />
        <br>
        <input class="MyButton" type="button" value="Fishtank Toggle" onclick="togglelight('128')" />


    </form>


    </body>

<script type="text/javascript">
        function togglelight(ipstr) {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      console.log(this.responseText); //To check output while error[Optional]
    }
  };
  xhttp.open("GET", "http://192.168.1."+ipstr+"/cm?cmnd=Power%20toggle", true);
  xhttp.send();
}
</script>
    </html>

愿你的鱼成为...

Answer 3

因此，您希望在不显示结果的情况下运行链接/页面。为什么不看看XMLHttpRequest。您可以在不离开原始页面的情况下进行请求。这是一个例子。

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  // check the response status/state
  if (this.readyState == 4 && this.status == 200) {
    //Create a response action here
  }
};
// create a request
xhttp.open("GET", "http://192.168.1.126/cm?cmnd=Power%20toggle", true);
xhttp.send();

希望这对您有所帮助。

编辑

您的代码将如下所示

function togglelight() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      console.log(this.responseText); //To check output while error[Optional]
    }
  };
  xhttp.open("GET", "http://192.168.1.126/cm?cmnd=Power%20toggle", true);
  xhttp.send();
}

<html>
<body>
  <input class="MyButton" type="button" value="Office Toggle" onclick="togglelight()" />
  <br>
  <input class="MyButton" type="button" value="Fishtank Toggle" onclick="togglelight()" />
</body>
</html>

Answer 4

您可以考虑使用iframe吗？

<a href="http://192.168.1.126/cm?cmnd=Power%20toggle" target="hidden_frame">Toggle the Light</a>

<iframe src="" name="hidden_frame" style="display:none;"></iframe>

如何在不显示输出的情况下运行链接

4 个答案:

编辑