菜鸟谢了一个切换歌曲的方法,不知道为什么实现不了,貌似是因为获取不到
  • 标签的内容

一贯可乐 2017-12-29 04:59:55
我导入了bootstrap的四个文件;还有,图片在我自己的电脑里



<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="../js/jquery-1.11.3.min.js" ></script>
<link rel="stylesheet" href="../css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="../css/bootstrap.min.css" />
<script type="text/javascript" src="../js/bootstrap.min.js" ></script>

</head>
<body>
<div class="container">
<div class="row">
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!--
自己画的logo
-->
<a href="#">
<img height="40px" style="margin-top: 5px;" src="../img/pipi音乐.jpg" />
</a>
</div>

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<!--
搜索用表单
-->
<form class="navbar-form navbar-right" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="素颜-许嵩">
</div>
<button type="submit" class="btn btn-default">搜索</button>
</form>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
</div>
<div class="row" style="border-radius: 15px; background-color: #999999;">
<div class="col-sm-4" >
<!--
下拉菜单
-->
<div class="row ">
<div ondblclick="h(this)" onclick="show(this)" class="btn btn-success col-sm-7 col-sm-offset-1">音乐列表</div>
</div>
<div class="col-sm-10">
<ol id="list" style=" display: none; background-color: whitesmoke; margin-top: 10px;">
<li class="btn">
许嵩,何曼婷 - 素颜
</li>
<li class="btn">
By2 - 爱丫爱丫
</li>
<li class="btn">
有澤孝紀 - Run With The Wind
</li>
<li class="btn">
胡夏 - 同桌的你
</li>
<li class="btn">
许嵩 - 玫瑰花的葬礼
</li>
<li class="btn">
许嵩 - 断桥残雪
</li>
<li class="btn">
赵雷 - 吉姆餐厅
</li>
</ol>
<div class="col-sm-6">
<a class="btn btn-primary" >添加</a>
</div>
<div class="col-sm-6">
<a class="btn btn-danger" >删除</a>
</div>
</div>
</div>
<div class="col-sm-5">
<!--
歌手的图片
-->
<div>
<img width="370px" src="../img/04/timg.jpg"/>
</div>
<!--
播放器
-->
<div id="bofang" class="col-sm-offset-2">
<audio id="mp3" autoplay="autoplay" controls="controls" src="../audio/许嵩,何曼婷 - 素颜.mp3"></audio>
</div>

</div>
</div>
</div>
<script>
//下拉菜单
function show(div){
div.innerHTML="音乐列表(单击打开)"
div.parentNode.parentNode.getElementsByTagName("ol")[0].style.display="block";
}
function h(div){
div.innerHTML="音乐列表(双击收起)"
div.parentNode.parentNode.getElementsByTagName("ol")[0].style.display="none";
}
var arr = ["许嵩,何曼婷 - 素颜.mp3",
"By2 - 爱丫爱丫.mp3",
"有澤孝紀 - Run With The Wind.mp3",
"胡夏 - 同桌的你.mp3",
"许嵩 - 玫瑰花的葬礼.mp3",
"许嵩 - 断桥残雪.mp3",
"赵雷 - 吉姆餐厅.mp3"]
//点击后切换歌曲
window.onload =function(){
var lis =document.getElementById("list").getElementsByTagName("li");
for (var i=0;i<lis.length;i++) {
lis[i].onclick=function(){
document.getElementById("mp3").pause()
document.getElementById("mp3").src="../audio/"+ lis[i].innerHTML + ".mp3"
alert(lis[i].innerHTML)
document.getElementById("mp3").currentTime =0;
document.getElementById("mp3").play()
}
}
}
</script>
</body>
</html>
...全文
206 1 打赏 收藏 转发到动态 举报
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
jslang 2017-12-29
  • 打赏
  • 举报
 回复
document.getElementById("mp3").src="../audio/"+ this.innerHTML + ".mp3"
SCI复现含可再生能源与储能的区域微电网最优运行：应对不确定性的解鲁棒性与非预见性研究（Matlab代码实现）
【SCI复现】含可再生能源与储能的区域微电网最优运行：应对不确定性的解鲁棒性与非预见性研究（Matlab代码实现）内容概要：本文围绕含可再生能源与储能的区域微电网最优运行展开研究，重点探讨应对不确定性的解鲁棒性与非预见性策略，通过Matlab代码实现SCI论文复现。研究涵盖多阶段鲁棒调度模型、机会约束规划、需求响应机制及储能系统优化配置，结合风电、光伏等可再生能源出力的不确定性建模，提出兼顾系统经济性与鲁棒性的优化运行方案。文中详细展示了模型构建、算法设计（如C&CG算法、大M法）及仿真验证全过程，适用于微电网能量管理、电力系统优化调度等领域的科研与工程实践。; 适合人群：具备一定电力系统、优化理论和Matlab编程基础的研究生、科研人员及从事微电网、能源管理相关工作的工程技术人员。; 使用场景及目标：①复现SCI级微电网鲁棒优化研究成果，掌握应对风光负荷不确定性的建模与求解方法；②深入理解两阶段鲁棒优化、分布鲁棒优化、机会约束规划等先进优化方法在能源系统中的实际应用；③为撰写高水平学术论文或开展相关课题研究提供代码参考和技术支持。; 阅读建议：建议读者结合文档提供的Matlab代码逐模块学习，重点关注不确定性建模、鲁棒优化模型构建与求解流程，并尝试在不同场景下调试与扩展代码，以深化对微电网优化运行机制的理解。
干辣椒粉，全球前10强生产商排名及市场份额（by QYResearch）.docx
干辣椒粉，全球前10强生产商排名及市场份额（by QYResearch）.docx
Adobe XD 2025（XD 58）安装教程及下载
Adobe XD 2025（XD 58）安装教程及下载
现代物流行业交通工具背景PPT模板
下载方式：https://pan.quark.cn/s/88340bbdd0a9 这是一套以交通工具为元素的，面向现代物流领域的PPT演示文稿模板，总共包含22页幻灯片。 模板的封面部分采用了多种蓝色及紫色色块进行装饰，并融合了若干物流运输工具，例如飞机、高速列车等作为视觉元素，用以构成背景设计，从而使得整个演示文稿模板与物流行业的主旨高度契合。 在内容页的设计上，模板继续运用蓝色与紫色进行色彩搭配，精心制作了20页采用扁平化设计的幻灯片图表。 此模板主要适用于构建物流行业相关的项目工作报告演示文稿。 文件存储格式为.PPTX。
个人防护装备实例分割数据集-20251118-012304.zip
个人防护装备实例分割数据集 一、基础信息 数据集名称：个人防护装备实例分割数据集 图片数量： 训练集：4,524张图片 分类类别： - Gloves（手套）：工作人员佩戴的手部防护装备。 - Helmet（安全帽）：头部防护装备。 - No-Gloves（未戴手套）：未佩戴手部防护的状态。 - No-Helmet（未戴安全帽）：未佩戴头部防护的状态。 - No-Shoes（未穿安全鞋）：未佩戴足部防护的状态。 - No-Vest（未穿安全背心）：未佩戴身体防护的状态。 - Shoes（安全鞋）：足部防护装备。 - Vest（安全背心）：身体防护装备。 标注格式：YOLO格式，包含实例分割的多边形坐标和类别标签，适用于实例分割任务。 数据格式：来源于实际场景图像，适用于计算机视觉模型训练。 二、适用场景 工作场所安全监控系统开发：数据集支持实例分割任务，帮助构建能够自动识别工作人员个人防护装备穿戴状态的AI模型，提升工作环境安全性。 建筑与工业安全检查：集成至监控系统，实时检测PPE穿戴情况，预防安全事故，确保合规性。 学术研究与创新：支持计算机视觉在职业安全领域的应用研究，促进AI与安全工程的结合。 培训与教育：可用于安全培训课程，演示PPE识别技术，增强员工安全意识。 三、数据集优势 精准标注与多样性：每个实例均用多边形精确标注，确保分割边界准确；覆盖多种PPE物品及未穿戴状态，增加模型鲁棒性。 场景丰富：数据来源于多样环境，提升模型在不同场景下的泛化能力。 任务适配性强：标注兼容主流深度学习框架（如YOLO），可直接用于实例分割模型开发，支持目标检测和分割任务。 实用价值高：专注于工作场所安全，为自动化的PPE检测提供可靠数据支撑，有助于减少工伤事故。
JavaScript

87,996

社区成员

224,693

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章