音乐播放器

最新推荐文章于 2024-10-02 18:56:51 发布

LIGHT03

最新推荐文章于 2024-10-02 18:56:51 发布

阅读量407

点赞数 10

文章标签： android

本文链接：https://blog.csdn.net/LIGHT03/article/details/135476778

版权

node.js:

const express = require("express");
const mysql = require("mysql");
const cors = require("cors");
const fs = require("fs");
const app = express();
app.use(cors());
let arring = [];
var arrp;
const db =mysql.createPool({
    host:"127.0.0.1",
    user:"root",
    password:"root",
    database:"day23"
})
app.get("/music",(req,res)=>{
  db.query("SELECT*FROM hhh",(err,results)=>{
    // console.log(results);
    console.log(results);
    res.send(results);
    }
  )})
app.listen(81,()=>{
  console.log("express服务启动成功");
})

js:

var x = document.getElementById("x");
	var y = document.getElementById("y");
	var song = document.querySelector("#song");
	var zsc=parseInt(song.duration);
	var bfsc= parseInt(song.currentTime);
	console.log(song.zsc);
	console.log(song.bfsc);
    function bbf(a){
            music=a;
			song.src = music;
            console.log(music);
         }
     function func1(){
		// zt.style.visibility = "visible";
        // bf.style.visibility = "hidden";
			// x.src = "./小王爱听music/电台/暂停.png";
			x.style.display = "none";
			y.style.display = "block";
        	song.play();
	 }
	function func2(){
			// x.src = "./小王爱听music/图标/展开.png";
			y.style.display = "none";
			x.style.display = "block";
        	song.pause();
     }
	 function func(){
        var sum = Math.floor(Math.random()*124);
        console.log(bbf(sing[sum].music));
        bbf(sing[sum].musiccc);
		func1();
     }

ajax:

let base = "http://127.0.0.1:81"
        var sing=[];
        var music=""
		var sum = 83;
        $.ajax({
                        type:"get",
                        url:`${base}/music`,
                        async:false,
                        data:{
                            
                        },
                        success:(req)=>{
                            console.log(req);
                           sing=req;
                           console.log(sing);
						   bbf(sing[sum].musiccc)
                    		console.log(sing[sum].musiccc);
                        }
                    })

html:

<div class="box1_D">
				<!-- 点击跳转播放音乐界面 -->
				<a href="./播放音乐界面.html"><div class="box1_sl" style="width: 40px;height: 40px;border: 2px solid #8c8c8e;margin-top:6px;margin-left: 100px;" onclick="funcB()">
                 <img src="./小王爱听music/图标/隐藏下拉键.png" alt="" style="width: 30px;height: 30px;margin-left: 5px;margin-top: 5px;display: none" class="box1_img">
				</div></a>
				<!-- 随机播放 -->
                    <div class="box1_sj" style="margin-top: -25px;margin-left: 750px">
                     <img src="./小王爱听music/图标/随机播放.png" alt="" style="width: 25px;height: 20px;">
					</div>
				<!-- 播放键  左 -->
                    <div class="box1_zj" style="width: 40px;height:40px;border-radius: 50%;
					background-color: #fff;margin-top: -35px;margin-left: 790px;">
                      <img src="./小王爱听music/图标/zuo.png" alt="" onclick="func()"  style="margin-top: 5px;margin-left:2px;">
					</div>
					<!-- 播放键及暂停键 -->
					<div class="box1_zt" style="width: 45px;height:45px;border-radius: 50%;
					background-color: #fff;margin-top: -43px;margin-left: 850px;">
                      <img src="./小王爱听music/图标/m_展开.png" onclick="func1()" id="x" alt="">
					  <img src="./小王爱听music/电台/暂停.png" alt="" onclick="func2()" style="display: none; " id="y">
					</div>
					<!--右 -->
					<div class="box1_yj" style="width: 40px;height:40px;border-radius: 50%;
					background-color: #fff;margin-top:-42px;margin-left: 920px;">
                      <img src="./小王爱听music/图标/you.png" alt="" onclick="func()" style="margin-top: 5px;margin-left:2px;">
					</div>
					<!-- 声音键 -->
					<div><audio id="song" src=""></audio></div>
			  </div>