html文件:
<html>
<head>
<meta charset="utf-8">
<title ></title>
<script data-main='js/main.js' src='js/libs/require.js'></script>
</head>
<body >
<div>
<audio autoplay controls src=""></audio>
<ul class='root'>
</ul>
</div>
</body>
</html>
主入口文件:
define(['http','view','config'],function(http,view,config){
http.http(config.publicUrl+config.path+config.list+"?type=1&count=20&offset=0",function(data){
console.log(data);
view.getView(data);
})
})
main.js文件:
requirejs.config({
baseUrl:'js/',
paths:{
'config':'apps/config',
'http':'apps/http',
'view':'apps/view',
'index':'apps/index',
'jquery':'libs/jquery-3.4.1'
}
})
requirejs(['config','http','view','index','jquery'],function(config,http,view,index,jquery){
})
网络请求文件:
define(['jquery'],function($)
{
function http(url,callback){
$.ajax({
url:url,
type:'get',
dataType:'json',
success:function(res){
callback(res);
}
})
}
return {
http:http()
}
})
配置文件:
define(function(){
return{
publicUrl:"http://www.wwtliu.com",
path:"/sxtstu/music/baidu/"
}
})
视口文件:
define(['jquery'],function($){
//假如数据已经存在
function getView(data)
{
if(data.song_list){
$(data.song_list).each(function(index,ele){
$('.root').append("<li musicid="+ele.song_id+">"+ele.title+'</li>');
})
//添加点击事件
$('.root').on('click',function(){
console.log($(this).attr('musicid'))
http.http("http://www.wwtliu.com"
"/sxtstu/music/baidu/play.php?mid="+$(this).attr('musicid'),function(data){})
})
}
}
return{
getView:getView
}
})