Exam.html 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. <h2>考场</h2>
  5. <div>
  6. <script src="jquery-1.8.2.js"></script>
  7. <script type="text/javascript">
  8. $(function () {
  9. var ws;
  10. //ip是远程服务端的ip,端口是远程服务端的端口
  11. var url = "ws://127.0.0.1:28800";
  12. $("#btnConnection").click(function () {
  13. if ("WebSocket" in window) {
  14. ws = new WebSocket(url);
  15. }
  16. else if ("MozWebSocket" in window) {
  17. ws = new MozWebSocket(url);
  18. }
  19. else
  20. alert("浏览器版本过低,请升级您的浏览器。\r\n浏览器要求:IE10+/Chrome14+/FireFox7+/Opera11+");
  21. //注册各类回调
  22. ws.onopen = function () {
  23. $("#msg").append("连接服务器成功<br/>");
  24. ws.send("K:考场已链接");
  25. }
  26. ws.onclose = function () {
  27. $("#msg").append("与服务器断开连接<br/>");
  28. }
  29. ws.onerror = function () {
  30. $("#msg").append("数据传输发生错误<br/>");
  31. }
  32. ws.onmessage = function (receiveMsg) {
  33. $("#msg").append(receiveMsg.data + "<br/>");
  34. }
  35. });
  36. $("#btnSend").click(function () {
  37. var text = $("#txtContent").val();
  38. //ws.send("K:" + text);
  39. ws.send("readcardno");
  40. $("#msg").append("发送信息至服务器: " + "K:" + text + "<br/>");
  41. });
  42. });
  43. </script>
  44. <input id="btnConnection" type="button" value="连接" />
  45. <br />
  46. <textarea cols="100" rows="10" id="txtContent"></textarea>
  47. <br />
  48. <input id="btnSend" type="button" value="发送" />
  49. <hr />
  50. <span id="msg"></span>
  51. </div>
  52. </body>
  53. </html>