来八及de拥抱 2023-06-01 10:06 采纳率: 75%
浏览 18

前一段JavaScript是我向gpt问的,看起来好像没什么问题,但是在页面上没看到输入服务器的文本输入框和连接按钮

前一段JavaScript是我向gpt问的,看起来好像没什么问题,但是在页面上没看到输入服务器的文本输入框和连接按钮,这是为什么?


```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>示例网页</title>
<script>
var sockets = [];            //定义WebSocket对象数组

// 连接指定的服务器
function connectToServer(serverAddress) {
  // 创建一个新的WebSocket对象并将其添加到数组中
  var socket = new WebSocket(serverAddress);
  sockets.push(socket);
  // 为新的WebSocket对象设置事件处理程序
  socket.onopen = function() {
    console.log("Connected to server " + serverAddress);
    // 在页面上添加一个小圆点来表示连接状态
    addStatusDot(serverAddress);
  };
  socket.onclose = function() {
    console.log("Disconnected from server " + serverAddress);
    // 在页面上移除连接状态小圆点
    removeStatusDot(serverAddress);
  };
  socket.onmessage = function(event) {
    console.log("Received message from server " + serverAddress + ": " + event.data);
  };
}

// 发送消息到指定的服务器
function sendMessageToServer(serverAddress) {
  var message = document.getElementById("message-" + serverAddress).value;
  // 遍历WebSocket对象数组,找到指定服务器的对象并发送消息
  for (var i = 0; i < sockets.length; i++) {
    if (sockets[i].url == serverAddress) {
      sockets[i].send(message);
      break;
    }
  }
}

// 在页面上添加一个小圆点来表示连接状态
function addStatusDot(serverAddress) {
  var dot = document.createElement("span");
  dot.className = "status-dot";
  dot.style.display = "inline-block";
  dot.style.width = "10px";
  dot.style.height = "10px";
  dot.style.borderRadius = "50%";
  dot.style.marginRight = "5px";
  dot.style.backgroundColor = "green";
  var serverList = document.getElementById("server-list");
  var serverItem = document.createElement("li");
  serverItem.textContent = serverAddress;
  serverItem.appendChild(dot);
  serverList.appendChild(serverItem);
}

// 在页面上移除连接状态小圆点
function removeStatusDot(serverAddress) {
  var dot = document.querySelector(".status-dot");
  var serverItem = dot.parentNode;
  var serverList = serverItem.parentNode;
  serverList.removeChild(serverItem);
}

// 在页面上添加一个服务器连接项
function addServerListItem(serverAddress) {
  var serverList = document.getElementById("server-list");
  var serverItem = document.createElement("li");
  serverItem.textContent = serverAddress;
  serverList.appendChild(serverItem);
}
</script>
<style>
.status-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-right: 5px;
}
</style>
<link href="juzhong.css" rel="stylesheet" type="text/css">
</head>
<body>
<table width="724" border="0">
  <tr>
    <td width="187"><img src="tuxiang/川信新logo.jpg" width="162" height="153"></td>
    <td width="527"><h1>电子与物联网学院——智慧名牌示例</h1></td>
  </tr>
</table>

<ul id="server-list">
  <li>
    <div>一号 <span class="status-dot"></span></div>
    <input type="text" id="message-ws://serverAddress1">
    <button onclick="sendMessageToServer('ws://serverAddress1')">发送</button>
  </li>
  <li>
    <div>二号 <span class="status-dot"></span></div>
    <input type="text" id="message-ws://serverAddress2">
    <button onclick="sendMessageToServer('ws://serverAddress2')">发送</button>
  </li>
</ul>

<script>
// 连接服务器
connectToServer("ws://serverAddress1");
connectToServer("ws://serverAddress2");
</script>

</body>
</html>


```

  • 写回答

1条回答 默认 最新

  • 奥哩奥 2023-06-01 10:15
    关注

    这两个就是呀,检查一下这两个在页面有没有报错

     <li>
        <div>一号 <span class="status-dot"></span></div>
        <input type="text" id="message-ws://serverAddress1">
        <button onclick="sendMessageToServer('ws://serverAddress1')">发送</button>
      </li>
      <li>
        <div>二号 <span class="status-dot"></span></div>
        <input type="text" id="message-ws://serverAddress2">
        <button onclick="sendMessageToServer('ws://serverAddress2')">发送</button>
      </li>
    
    评论

报告相同问题?

问题事件

  • 创建了问题 6月1日

悬赏问题

  • ¥15 基于STM32心率血氧监测(OLED显示)相关代码运行成功后烧录成功OLED显示屏不显示的原因是什么
  • ¥100 X轴为分离变量(因子变量),如何控制X轴每个分类变量的长度。
  • ¥30 求给定范围的全体素数p的(p-2)的连乘积
  • ¥15 VFP如何使用阿里TTS实现文字转语音?
  • ¥100 需要跳转番茄畅听app的adb命令
  • ¥50 寻找一位有逆向游戏盾sdk 应用程序经验的技术
  • ¥15 请问有用MZmine处理 “Waters SYNAPT G2-Si QTOF质谱仪在MSE模式下采集的非靶向数据” 的分析教程吗
  • ¥15 adb push异常 adb: error: 1409-byte write failed: Invalid argument
  • ¥15 nginx反向代理获取ip,java获取真实ip
  • ¥15 eda:门禁系统设计