jquery zeigen ausgewählten Drop-Down-Wert

Question

Der linke Teil ist das Dropdown, um andere Musik zu wählen. Zeige den Musiknamen im rechten Teil. Der Code kann nur den ersten Code anzeigen. Wenn ich eine andere Musik auswähle, kann sie nicht zum aktuellen Wert wechseln.

html:

<div class="form-group"> 
     <label class="col-sm-2 control-label">Music</label> 
     <div class="col-sm-5"> 
     <select class="form-control" name="music" id="selectedmusic"> 
      <option value="buddy">Buddy</option> 
      <option value="cute">Cute</option> 
     </select> 
     </div> 
     <div class="col-sm-5" id="mp3play"> 
     </div> 
</div> 

jquery:

$(document).ready(function(){ 
    var music = $('#selectedmusic option:selected').text(); 
    $("#mp3play").html(music); 
    }); 

Answer 1

Versuchen Sie das mal:

$(document).ready(function(){ 
    $('#selectedmusic').change(function(){ 
     $("#mp3play").text(this.value); 
    }); 
}); 

Sie haben die Javascript zu sagen, um die Änderung des Wertes dieser Auswahl-Box zu sehen . Sonst würde es sich nur einmal ansehen, wenn der Körper fertig ist, aber niemals aktualisieren, wenn du es änderst, weil du es nicht sagst.

Answer 2

$(document).ready(function(){ 
    $('#selectedmusic').change(function){ 
    var music = $('#selectedmusic option:selected').text(); 
    $("#mp3play").html(music); 
    }); 
});