Dado que es un select
, puedes hacer algo así:
$(function() {
$('#sel-video').on('change', function() {
var srcVideo = $(this).val();
$('#demo-player').attr('src', $(this).val()srcVideo);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="sel-video">
<option value="-1"value="https://ss3.domint.net:3114/t11_str/telesistema/playlist.m3u8" selected=true>--Escoja un vídeo--</option>
<option value="https://mdn.github.io/learning-area/javascript/apis/video-audio/finished/video/sintel-short.mp4">Mountain</option>
<option value="https://mdn.github.io/learning-area/html/multimedia-and-embedding/video-and-audio-content/rabbit320.mp4">Rabbit</option>
</select>
<video id="demo-player" controls playsinline class="cld-video-player" style="width: 100%; margin-bottom: 10px" height="500">
<source src="https://ss3.domint.net:3114/t11_str/telesistema/playlist.m3u8" type="application/x-mpegURL" />
Aquí se escuchan los cambios del select
y se usa el value
del mismo para poner la URL del vídeo. Cuando el select
cambia, se setea a src
el video correspondiente.
En la primera opción he puesto el vídeo que viene en el contenedor video
(como si fuera por defecto), para que si se vuelve a esa opción, se ponga de nuevo ese vídeo en el contenedor. Esto es útil por ejemplo si de entrada se quiere mostrar un vídeo de bienvenida.