新增输入框输入歌曲名

2024-01-28 18:25:22 +08:00 · 2024-01-28 18:25:22 +08:00 · 88e5d98c68
commit 88e5d98c68
parent c7ab57c06a
2 changed files with 28 additions and 1 deletions
--- a/xiaomusic/static/app.js
+++ b/xiaomusic/static/app.js
@ -6,7 +6,9 @@ $(function(){
    $container=$("#cmds");
    // 遍历数据
    for (const [key, value] of Object.entries(data)) {
-      append_op_button(key);
+      if (key != "分钟后关机" && key != "放歌曲") {
+        append_op_button(key);
+      }
    }

    append_op_button("5分钟后关机");
@ -41,4 +43,21 @@ $(function(){
      // 添加按钮到容器
      $container.append($button);
  }
+
+  $("#play").on("click", () => {
+    name = $("#music-name").val();
+    let cmd = "播放歌曲"+name;
+    $.ajax({
+      type: "POST",
+      url: "/cmd",
+      contentType: "application/json",
+      data: JSON.stringify({cmd: cmd}),
+      success: () => {
+        // 请求成功时执行的操作
+      },
+      error: () => {
+        // 请求失败时执行的操作
+      }
+    });
+  });
 });
--- a/xiaomusic/static/index.html
+++ b/xiaomusic/static/index.html
@ -11,6 +11,9 @@
          width: 100px;
          height: 50px;
      }
+      input {
+          height: 40px;
+      }
    </style>
 </head>
 <body>
@ -18,5 +21,10 @@
    <hr>
    <div id="cmds">
    </div>
+    <hr>
+    <div>
+      <input id="music-name" type="text" placeholder="请输入歌曲名称"></input>
+      <button id="play">播放</button>
+    </div>
 </body>
 </html>