Question

我有一个视频标签和一个选择框。我的代码：

<video src="default.mp4" id="videobox">Your browser does not support the video tag.</video>
 <select id="test">
        <option value="./A.mp4">A</option>
        <option value="./B.mp4">B</option>
        <option value="./C.mp4">C</option>
    </select>

我需要根据选择框值更改视频标记的src值。

如果我选择选项A，则选项A（./ A.mp4）的值应填入视频的src。

我需要写jquery。

Answer 1

您应该处理选择框的更改事件，然后根据所选的值更改视频的src属性，如下所示：

$("#test").on("change", function() {
    $("video").attr("src", $(this).val());
});

Answer 2

选择框onchange事件将被触发，视频src属性值将相应更新选择框。

$(document).ready(function(){
  $('video').attr('src',$("#test").val());
  $("#test").change(function(){
    $('video').attr('src',$(this).val());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<video src="default.mp4">Your browser does not support the video tag.</video>
<select id="test">
  <option value="./A.mp4">A</option>
  <option value="./B.mp4">B</option>
  <option value="./C.mp4">C</option>
</select>

Answer 3

请尝试onchange进行选择。

$("#test").on("change", function() {
  $(this).prev().attr("src", $(this).val());
});

如何根据选择框中的选项值更改视频的src值

3 个答案: