Изменение видео на основе выпадающего списка В JQuery

Question

Я пытаюсь изменить видео src с помощью Jquery при изменении выпадающего списка.

Вот мой Jquery сценарии код,

<script type="text/javascript"> 
      $(document).ready(function(){ 
       $("#videoSelect").change(function() { 
       var videoValue = $(this).val(); 

       if(videoValue==1){ 
        console.log("Inside"+videoValue); 
        $("#video2").attr('src','video/1.mp4'); 
       } 
       else if(videoValue==2){ 
        console.log("Inside"+videoValue); 
        $("#video2").attr('src','video/2.mp4'); 
       } 
       else{ 
        console.log("Inside"+videoValue); 
        $("#video2").attr('src','video/3.mp4'); 
       } 

      }); 
      }); 
</script> 

Вот мой HTML код:

<tr> 
    <td> 
     <select id="videoSelect"> 
      <option value="1">Higher Education in India </option> 
      <option value="2">Sardar Vallabh Bhai Patel</option> 
      <option value="3">Maulana Abul Kalam Azad</option> 
     </select> 
    </td> 
</tr> 
<tr> 
    <td> 
     <video width="100%" height="202px" controls=""> 
      <source id="video2" src="video/Education In India.mp4" type="video/mp4">      
      <object width="260" height="150" type="application/x-mplayer2"> 
       <param name="fileName" value="video/movie.swf"> 
       <param name="autostart" value="0"> 
      </object> 
     </video> 
    </td> 
</tr> 

Что видит код работает правильно и при выборе выпадающего видео " src " Изменения атрибута (как я анализирую с использованием элемента Inspect), но само видео не меняется, вместо этого воспроизводя начальное видео.

Пожалуйста, помогите мне с этой проблемой.

Спасибо.

Answer 1

Установите идентификатор id = "video2" на тег видео вместо тега источника, затем он будет работать.