我不知道这是否会解决这个问题,但div
是缺乏在脚本之前的HTML结束标记。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Security-Policy" content="connect-src 'self' http://share.kisomunitel.com; style-src 'self' 'unsafe-inline'; media-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
<!--<meta http-equiv="Content-Security-Policy" content="connect-src 'self' http://192.168.53.1; style-src 'self' 'unsafe-inline'; media-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval'">-->
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
<title>Rival Music</title>
<script type="text/javascript" src="cordova.js"></script>
</head>
<body ng-csp ng-cloak>
<div ng-controller="control">
<ul class="nav nav-pills nav-justified" style="position: fixed;top: 0;z-index: 1000;">
<li role="presentation" class="active">
<a href="#home" data-toggle="tab">
<span class="glyphicon glyphicon-equalizer"></span>
</a>
</li>
<li role="presentation">
<a href="#fav" data-toggle="tab">
<span class="glyphicon glyphicon-phone"></span>
</a>
</li>
<li role="presentation">
<a href="#search" data-toggle="tab">
<span class="glyphicon glyphicon-search zoomIn animated"></span>
</a>
</li>
<li role="presentation">
<a href="#dj" data-toggle="tab">
<span class="glyphicon glyphicon-cd"></span>
</a>
</li>
<li role="presentation">
<a href="#def" data-toggle="tab">
<span class="glyphicon glyphicon-user"></span>
</a>
</li>
</ul>
<!-- Tab panes -->
<!-- HOME -->
<div class="tab-content" style="padding-top: 40px;">
<div role="tabpanel" class="tab-pane fade in active" id="home">
<div class="container-fluid" style="padding-top:10px;margin-bottom:85px">
<h4 style="color:white">Álbuns em destaque</h4>
<div class="media" style="color:white">
<div class="media-left">
<a href="#">
<img class="media-object" src="img/cd.jpg" width="50px" alt="...">
</a>
</div>
<div class="media-body">
<h4 class="media-heading">Views</h4> Drake
</div>
</div>
</div>
</div>
<!-- Guardadas -->
<div role="tabpanel" class="tab-pane fade" id="fav">
<div class="container-fluid" style="margin-bottom:85px">
<h4 style="color:white">Guardadas</h4>
<input type="text" ng-model="search.title" style="margin-bottom:5px; margin-top: 5px;" class="form-control" placeholder="Procurar">
<select class="form-control" style="margin-bottom:5px;">
<option value="0" selected>Músicas</option>
<option value="1">Álbuns</option>
<option value="2">Sequências</option>
</select>
<div class="text-muted" ng-show="trackPhone.length=0">Sem conteúdo</div>
<div ng-repeat="music in trackPhone | filter:search" class="media-results">
<div class="media">
<div class="media-body">
<span style="display:none">{{music.cdn_clip_d}}</span>
<h4 class="media-heading">{{$index + 1}}. {{music.artist_name}} - {{music.title}}</h4>
<div style="font-size: 14px;margin-bottom:5px">
<span class="label label-danger" ng-click="showAlbum(music.product_id)"><b>Álbum:</b> {{music.album_title}}</span>
</div>
<div class="media-btn">
<a ng-click="playTrack(music, true)" class="btn btn-xs btn-primary">
<span class="fa fa-play"></span> Reproduzir
</a>
<a ng-click="addToPlaylist(music, true)" class="btn btn-xs btn-primary">
<span class="fa fa-plus"></span> Próximo
</a>
<div class="pull-right">
<button type="button" class="btn btn-xs btn-black" ng-click="">
Apagar
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- TOCA DJ -->
<div role="tabpanel" class="tab-pane fade" id="dj">
<div class="container-fluid" style="margin-bottom:85px">
<h3 style="color:white"><span class="label label-danger">toca</span> <b>DJ</b></h3>
<select class="form-control" ng-model="filter.genre" ng-init="filter.genre = options[0].value" ng-options="option.value as option.name for option in options" style="margin-bottom:5px;margin-top: 5px;">
</select>
<div class="media-results" style="border:0">
<div class="media" ng-repeat="mix in tocaDj | filter: filter.genre" style="margin-bottom:5px;">
<div class="media-body">
<div style="font-size: 14px">De DJ {{mix.artist_name}}</div>
<h4 class="media-heading"><b>Mix.</b> {{mix.title}}</h4>
<a ng-click="playTrack(mix, false)" class="btn btn-xs btn-primary">
<span class="fa fa-play"></span> Reproduzir
</a>
<a class="btn btn-xs btn-success">
<span class="glyphicon glyphicon-thumbs-up"></span>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- PROCURA -->
<div role="tabpanel" class="tab-pane fade" id="search">
<div class="container-fluid" style="margin-bottom:85px;padding-top:10px">
<input type="text" ng-model="string" class="form-control" ng-change="search()" placeholder="Procurar" style="margin-bottom:5px;">
<select class="form-control" id="search_type" style="margin-bottom:5px;margin-top: 5px;">
<option value="tracks" selected>Músicas</option>
<option value="artists">Artístas</option>
<option value="albums">Álbuns</option>
</select>
<button class="btn btn-sm btn-primary btn-block" ng-click="search()" style="margin-bottom:5px;">Procurar
</button>
<div style="color:white;text-align:center">
<img ng-if="working" src="img/loading.svg" style="padding:5px;" />
</div>
<div ng-repeat="music in search.musics | limitTo:50" class="media-results">
<div class="media">
<div class="media-body">
<span style="display:none">{{music.cdn_clip_d}}</span>
<h4 class="media-heading">{{music.artist_name}} - {{music.title}}</h4>
<div style="font-size: 14px;margin-bottom:5px">
<span class="label label-danger" ng-click="showAlbum(music.product_id)"><b>Álbum:</b> {{music.album_title}}</span>
</div>
<div class="media-btn">
<a ng-click="playTrack(music, true)" class="btn btn-xs btn-primary">
<span class="fa fa-play"></span> Reproduzir
</a>
<a ng-click="addToPlaylist(music, true)" class="btn btn-xs btn-primary">
<span class="fa fa-plus"></span> Próximo
</a>
<div class="pull-right">
<button type="button" class="btn btn-xs btn-black" ng-click="saveTrackDb(music)">
Guardar
</button>
</div>
</div>
</div>
</div>
</div>
<div ng-repeat="album in search.albums | limitTo:25" class="media-results">
<div class="media" ng-click="showAlbum(album.album_id)">
<div class="media-left">
<img class="media-object" ng-src="{{album.cover_320x320}}" width="65px" heigth="65px">
</div>
<div class="media-body">
<h4 class="media-heading">{{album.title}}</h4>
<div style="font-size: 14px;margin-bottom:5px">
{{album.artist_name}}
<br/> {{album.released_in}}
</div>
</div>
</div>
</div>
<div ng-repeat="artist in search.artists | limitTo:25" class="media-results">
<div class="media">
<div class="media-left">
<img class="media-object img-circle" ng-src="{{artist.image_160x160}}" width="65px" heigth="65px">
</div>
<div class="media-body">
<h4 class="media-heading">{{artist.name}}</h4>
<div style="font-size: 14px;margin-bottom:5px">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- DEFINIÇÕES -->
<div role="tabpanel" class="tab-pane fade" id="def">
<div class="container-fluid" style="margin-bottom:85px">
<h3 style="color:white">
<img class="img-rounded" src="img/cd.jpg" style="width: 60px; height: 60px;"> Lelo Lenda
<button class="btn btn-xs btn-black" data-toggle="modal" data-target="#novonomeModal" >Alterar nome
</button>
</h3>
<h5>
<label class="label label-danger">Restam 8 dias de utilização</label>
<!--<label class="label label-warning">Por favor recarregue !</label>-->
</h5>
<div>
<button class="btn btn-block btn-sm btn-primary" data-toggle="modal" data-target="#recargaModal">Recarregar
</button>
</div>
<h3 style="color:white">Informações</h3>
<h5 style="color:white">Número de telefone: 923145176</h5>
<h5 style="color:white">Total de músicas: 234</h5>
</div>
</div>
<!-- Modal Playlist -->
<div class="modal fade in out" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Sequência</h4>
</div>
<div class="modal-body">
<ul class="list-group" style="margin-bottom: 0">
<li class="list-group-item" ng-repeat="m in playlist">
<button class="btn btn-xs btn-danger" ng-click="removeFromPlaylist($index)">
<span aria-hidden="true">×</span>
</button>
<span ng-click="playTrack(m, false)">
<span class="fa fa-play" ng-if="playCurrent.id==m.track_id"></span> {{m.artist_name}} - {{m.title}}
</span>
</li>
</ul>
</div>
<div class="modal-footer">
<button class="btn btn-xs btn-block btn-danger" ng-click="clearPlaylist()">Limpar</button>
<button type="button" class="btn btn-xs btn-block btn-primary">
Guardar
</button>
<button type="button" class="btn btn-sm btn-default btn-block" data-dismiss="modal">Esconder</button>
</div>
</div>
</div>
</div>
<!-- Modal Álbum -->
<div class="modal fade out" id="albumModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<img class="img-thumbnail" class="m-b-1" ng-src="{{showinAlbum.cover_320x320}}" style="width: 100px; height: 100px">
<h3 class="modal-title" id="myModalLabel">
{{showinAlbum.artist_name}} - <b>{{showinAlbum.title}}</b>
</h3>
<span class="label label-danger">Álbum</span>
<span class="label label-danger">{{showinAlbum.released_in}}</span> {{showinAlbum.tracks.length}} faixa<span ng-show="showinAlbum.tracks.length > 1">s</span>
</div>
<div class="modal-body">
<ul class="list-group" style="margin-bottom: 0">
<li class="list-group-item" ng-repeat="music in showinAlbum.tracks">
<div>{{$index+1}}. <b>{{music.title}}</b></div>
<a ng-click="playTrack(music, true)" class="btn btn-xs btn-primary">
<span class="fa fa-play"></span> Reproduzir
</a>
<button ng-click="addToPlaylist(music, true)" class="btn btn-xs btn-primary">
<span class="fa fa-plus"></span> Próximo
</button>
<button ng-click="" class="btn btn-xs btn-success pull-right">
Guardar
</button>
</li>
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btn-block" data-dismiss="modal">Fechar</button>
</div>
</div>
</div>
</div>
<!-- Modal Novo Nome -->
<div class="modal fade in out" id="novonomeModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Alterar Nome</h4>
</div>
<div class="modal-body">
<input type="text" class="form-control" placeholder="Nome">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success btn-block" data-dismiss="modal">Salvar</button>
</div>
</div>
</div>
</div>
<!-- Modal Recargar -->
<div class="modal fade in out" id="recargaModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Recarregar</h4>
</div>
<div class="modal-body">
<input type="text" class="form-control" placeholder="Introduzir código">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success btn-block" data-dismiss="modal">Confirmar</button>
</div>
</div>
</div>
</div>
<!-- Modal Options -->
<div class="modal fade in out" id="opModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Recarregar</h4>
</div>
<div class="modal-body">
<button type="button" class="btn btn-success btn-block" ng-click="saveTrackDb(op)" data-dismiss="modal">Guardar</button>
<button type="button" class="btn btn-primary btn-block" data-dismiss="modal">Partilhar Facebook</button>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success btn-block" data-dismiss="modal">Fechar</button>
</div>
</div>
</div>
</div>
<div class="app-footer">
<div id="playerScreen" ng-init="playerText = ''">
{{playerText}}
</div>
<audio id="music_player" controls preload="no" src=""></audio>
<audio id="tone" src="file:///android_asset/www/audio/dewdrop.wav" preload="yes" style="display:hidden;">
</audio>
<div style="width: 100%;display: flex;height: 40px;">
<a ng-click="playPrev()" class="btn btn-sm btn-black" style="width:30%;padding-top: 7px;text-align:right;">
<span class="fa fa-chevron-circle-left fa-lg"></span>
</a>
<a class="btn btn-sm btn-black" data-toggle="modal" data-target="#myModal" style="width:40%;padding-top: 5px;">
<span class="fa fa-headphones fa-2x"></span>
</a>
<a ng-click="playNext()" class="btn btn-sm btn-black" id="track-next" style="width:30%;padding-top: 7px;text-align:left;">
<span class="fa fa-chevron-circle-right fa-lg"></span>
</a>
</div>
</div>
</div>
</div> <!-- this tag -->
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/CordovaFileCache.js"></script>
<script type="text/javascript" src="js/CordovaPromiseFS.js"></script>
<script type="text/javascript" src="js/kisam.js"></script>
<script type="text/javascript">
angular.element(document).ready(function() {
if (window.cordova) {
document.addEventListener('deviceready',
function() {
angular.bootstrap(document.body, ['apk']);
}, false);
} else {
angular.bootstrap(document.body, ['apk']);
}
});
</script>
</body>
</html>
https://jsfiddle.net/52vs3mg1/3/
你可以把这个中的jsfiddle?这是很难阅读justpaste.it –
不,请先在你的问题** [mcve] **。 – j08691
@AlexJohnson ok检查链接 –