javascript - php从输入类型文件中选择时使用jwplayer打开视频

Question

我有一个带有表单的 html 和一个带有 type="file" 的输入。我正在尝试在上传之前使用 jwplayer 选择文件后播放 mp4 文件。我需要立即播放视频。这是代码:

 <script type="text/javascript">
    function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
                $('#test2').attr('src', e.target.result);
                var fuData = document.getElementById('creative_file_video');
                var FileUploadPath = fuData.value;
                //   alert( FileUploadPath);

                playvideo( FileUploadPath);
            }

            reader.readAsDataURL(input.files[0]);
        }

        document.getElementById('asd').style.display = 'block';
    }
</script>

<input type="file" name="creative_file_video" id="creative_file_video" onchange="readUrl(this)" />

<div id="asd" style="display: none;">
<script type="text/javascript" src="jw/jwplayer.js"></script>

<div id="player">Loading the player...</div>

<script type="text/javascript">
    function playvideo(fileInput)
    {
        jwplayer("player").setup({ file:fileInput,
            image:"",
            autostart: true,
            height: 100,
            width: 100
        });
    }
</script>
</div>

当我加载页面时，会出现 JWPlayer，但它显示错误文本“加载媒体时出错”。

Answer 1

这只是对问题的随机猜测，因为您没有提供完整的信息，所以您所面临的问题我将在查看您的代码后采用我的猜测。

请尝试以下代码

    <div id="asd" style="display: none;">
    <script type="text/javascript" src="jw/jwplayer.js"></script>

    <div id="player">Loading the player...</div>
    </div>
    <script type="text/javascript">
        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    $('#test2').attr('src', e.target.result);
                    var fuData = document.getElementById('creative_file_video');
                    var FileUploadPath = fuData.value;
                    //   alert( FileUploadPath);

                    playvideo( FileUploadPath);
                }

                reader.readAsDataURL(input.files[0]);
            }

            document.getElementById('asd').style.display = 'block';
        }
           function playvideo(fileInput)
        {
            jwplayer("player").setup({ file:fileInput,
                image:"",
                autostart: true,
                height: 100,
                width: 100
            });
        }
    </script>

如果有效，那么问题就是这个问题 here

如果仍然出现错误，请检查

如果您的播放器根本没有出现，请检查您是否:

• 已上传jwplayer.js并包含加载标签 jwplayer.js 在页面的头部。

• 包含一个具有 id 属性的容器并引用它 jwplayer(id).setup() 调用中的 id。

• 正确设置 jwplayer(id).setup() 调用中所有选项的格式。我们 经常会看到逗号、方括号或大括号的问题。

查看更多信息here