• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Musikbox

Status
Für weitere Antworten geschlossen.

yoshi95

Neues Mitglied
Hallo Community,

ich habe folgende Musikbox gebastelt:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script type="text/javascript">
function playmusic() {
document.getElementById('music').src = document.f1.titel.value + '_' + document.f1.interpret.value + '.mp3';;
}
</script>
<title>Musikbox</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
</head>
<body>
<bgsound id="music">
<form name="f1">
Musiktitel <input type="text" name="titel"><br>
Interpret <input type="text" name="interpret"><br>
<input type="button" onclick="playmusic();" value="Spielen">
</form>
</body>
</html>

Die Titel habe unter folgender Syntax in meinem Ordner gespeichert: Titel_Interpret.mp3. Jetzt würde ich gerne, wenn es die mp3-Datei NICHT gibt, eine Fehlermeldung anzeigen lassen. Ist das mit Js realisierbar???

MfG, Yoshi95
 
Da fällt mir nur eine Lösung mit Ajax ein

du rufst die Datei mittels ajax auf, und wenn die rückgabe ein 404 enthält, dann gibt es die Datei anscheinend nicht.

Hat auch gleich einen Vorteil ^^ die Musikdateien werden schon vorgeladen xD
 
Wenn ich mich recht entsinne gibts in JS doch try & catch .. damit würds dann doch machbar sein.

oder:

if(! blablabla.mp3){
weiterer fehlercode;
}
 
da ist aber die frage ob das embed was zurückliefert wenn die datei nicht da ist.
Denn das ändern des src="" attributes schlägt ja nicht fehl, nur das embed kann es nicht abspielen.
 
Also ehrlich gesagt habe ich KEINE Ahnung von Ajax :oops:

Ich weiß, man sollte sowas nicht verlangen, aber ich bitte dich, mir irgendsoein Script zu geben und mir zu Sagen, wie ich das einbauen soll!!!:mrgreen:
 
nach ein wenig experimentieren hab ich es geschafft ^^

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Music Player</title>
<style type="text/css">
<!--
#player{display:none;}
-->
</style>
<script type="text/javascript">
<!--
var titel,interpret,mp3
var xmlHttp = false;
var succeed = false;
try {
  xmlHttp  = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e) {
  try {
    xmlHttp  = new ActiveXObject("Microsoft.XMLHTTP");
  }
  catch(e) {
    xmlHttp  = false;
  }
}
if (!xmlHttp  && typeof XMLHttpRequest != 'undefined') {
  xmlHttp = new XMLHttpRequest();
}
function playnow(form) {
var succeed = false;
titel = form.titel.value
interpret = form.interpret.value
mp3 = titel+"_"+interpret+".mp3"
if (xmlHttp) {
  xmlHttp.open('GET', mp3, true);
  xmlHttp.onreadystatechange = function () {
      if (xmlHttp.readyState == 4) {
        text = xmlHttp.responseText
        if(!text.match(404)){
          document.getElementById('player').innerHTML = '<embed autostart="true" src="'+mp3+'" width="0" height="0"></embed>'
          alert('now playing : '+mp3)
        }
        else {
          alert('file not found')
        }
      }
    };
    xmlHttp.send(null);
  }
}
function stopit() {
document.getElementById('player').innerHTML = ''
alert('music stopped')
}
-->
</script>
</head>
<body>
<br>
<div id="player"></div>
<form action="" method="get" onSubmit="playnow(this);return false;" onReset="stopit();return true;">
Ttiel: <input type="text" name="titel"></input><br>
Interpret: <input type="text" name="interpret"></input><br>
<input type="submit" value="play"></input>
<input type="reset" value="stop"></input>
</form>
</body>
</html>
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben