Chrome无法使用PHP/JS生成多个JW播放器

Chrome fails to generate multiple JW players with PHP/JS

本文关键字：播放器 JW JS PHP Chrome      更新时间：2023-09-26

我很难用PHP和Javascript让Chrome生成多个JW播放器。值得一提的是，在Opera/Pale Moon/Firefox中一切都运行良好。这是它应该看起来的样子，这是它在Chrome中的渲染方式。有趣的是，当我把鼠标悬停在JW播放器应该在的地方时，光标变成了"指针"，我就可以播放文件了，只是播放器本身是不可见的。

我有多个音频文件，有他们所有的信息(文件名，路径，描述等)在MySQL数据库。因此，while循环为数据库中的每个文件生成单独的DIV，并将其ID标记设置为文件名值。下面是代码(我省略了MySQL查询和其他所有内容，因为这是麻烦的部分):

<?php
while ($row = mysql_fetch_array($query)){
    $fullpath = $row['fileFolder'].$row['fileName']; ?>
    <div id="<?php echo $row['fileName']; ?>">Loading the player...</div>
        <script type="text/javascript">
        var divName = <?php echo json_encode($row['fileName']); ?>; //since each DIV id has to be different
        var fullpath = <?php echo json_encode($fullpath); ?>;
            jwplayer(divName).setup({
                file: fullpath,
                width:300,
                height:30
            });
        </script>
    <?php
        echo "<p class='descriptionAudio'>".$row['description'];
        echo "<br>";
} ?>

Chrome显示与工作浏览器相同的源代码，而Chrome的开发工具显示:

There was an error while handling a listener: Error: SyntaxError: DOM Exception 12 function (a){n.playerReady(a);f.css.unblock()} jwplayer.js:3
42 Uncaught Error: SyntaxError: DOM Exception 12

顺便说一下，当我手动设置div ID值时，一切都工作得很好。

当您手动指定id而不是像这一行所示的基于文件名时，您会说它有效:

  <div id="<?php echo $row['fileName']; ?>">Loading the player...</div>

使得来自数据库的某个ID可能不符合格式良好的DOM ID的要求。

尝试查找所使用的无效字符，或使用增量数字ID字段(以file_之类的前缀)代替。

相关文章：