esp8266建立的网页内输入框判断输入值是否为123,点击页面内按钮后如果是就向ESP8266返回1,并存在data这个变量中
时间: 2024-03-24 19:40:11 浏览: 55
好的,你可以使用以下代码实现:
1. 在你的ESP8266上建立一个网页,包含一个输入框和一个按钮,代码如下:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ESP8266 Webpage</title>
</head>
<body>
<h1>ESP8266 Webpage</h1>
<form>
<label for="input">输入框:</label>
<input type="text" id="input" name="input"><br><br>
<input type="button" value="提交" onclick="sendData()">
</form>
<script>
function sendData() {
var input = document.getElementById("input").value;
if (input == "123") {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == XMLHttpRequest.DONE) {
if (xhr.status == 200) {
console.log(xhr.responseText);
}
}
};
xhr.open("GET", "/?data=1", true);
xhr.send();
} else {
alert("输入错误!");
}
}
</script>
</body>
</html>
```
2. 在你的ESP8266上运行以下代码,用于接收来自网页的请求并处理:
```c++
#include <ESP8266WiFi.h>
const char* ssid = "your_ssid";
const char* password = "your_password";
WiFiServer server(80);
int data = 0;
void setup() {
Serial.begin(9600);
delay(10);
pinMode(LED_BUILTIN, OUTPUT);
digitalWrite(LED_BUILTIN, LOW);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(1000);
Serial.println("Connecting to WiFi...");
}
Serial.println("Connected to WiFi");
server.begin();
Serial.println("Server started");
}
void loop() {
WiFiClient client = server.available();
if (client) {
Serial.println("New client");
String request = client.readStringUntil('\r');
Serial.println(request);
client.flush();
if (request.indexOf("/?data=1") != -1) {
data = 1;
} else {
data = 0;
}
client.println("HTTP/1.1 200 OK");
client.println("Content-type:text/html");
client.println();
client.println("<html><body><h1>ESP8266 Webpage</h1></body></html>");
client.stop();
Serial.println("Client disconnected");
}
digitalWrite(LED_BUILTIN, data);
}
```
这样,当你在网页输入框中输入123并点击提交按钮时,ESP8266会接收到请求并将data设置为1,同时点亮板载LED。如果输入框中输入的不是123,则会弹出一个提示框。
阅读全文