0

当我的用户单击链接时，我希望更改源参数并将参数嵌入视频对象中，但我似乎无法显示新视频。参数中加载的默认视频可以正常工作，只是不确定如何才能加载新视频。这是我的脚本和 HTML。

<div id="videoPlayerDiv" style="height: 350px; width: 350px;">
<div id="videoTable">
    <table>
        <tr>
            <td><b>Trading Videos</b></td>
        </tr>
        <tr>
            <td>--></td><td><a href="#" onclick="playVideo('tradingOverview');">Trading Overview</a></td>
        </tr>
        <tr>
            <td>--></td><td><a href="#" onclick="playVideo('multiAccount');">Multi-Account Trading Wizard</a></td>
        </tr>
        <tr>
            <td>--></td><td><a href="#" onclick="playVideo('globalUnlock');">Global Unlock</a></td>
        </tr>
    </table>
</div>
<div id="videoPlayer" style="display:none; height: 250px; width: 250px;">
    <object id="objViewer" width="250" height="250" type="video/x-ms-asf" data="Wildlife.wmv" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">
        <param name="url" value="Wildlife.wmv">
        <param name="filename" VALUE="Wildlife.wmv">
        <PARAM name="autostart" VALUE="0">
        <param name="uiMode" value="full">
        <param name="autosize" value="1">
        <param name="playcount" value="1">
        <EMBED TYPE="application/x-mplayer2" src="Wildlife.wmv" NAME="MediaPlayer" id="wmvViewer" autostart="false"
            WIDTH="250" HEIGHT="250" ShowControls="1" ShowStatusBar="0" ShowDisplay="0"> 
        </EMBED>
    </OBJECT><br/>
    <a onclick="returnVideos();">Return to Videos</a>
</div>

后跟代码；

function playVideo(x){
$("#videoTable").attr("style","display:none;");
$("#videoPlayer").attr("style","display:block;");

var videoToPlay = x;
switch(videoToPlay){
    case 'tradingOverview':
        //alert(videoToPlay);
        var newElement = "Wildlife.wmv";
        $("#wmvViewer").attr('src', newElement);
    break;
    case 'multiAccount':
        //alert(videoToPlay);
        var newElement = "BabyBoyMainBackground.wmv";
        $("#wmvViewer").attr('src', newElement);
    break;
    case 'globalUnlock':        
        var newElement = "Panel_Mask.wmv";
        $('#objViewer').find('embed').attr('url', newElement);
        $('#objViewer').find('embed').attr('filename', newElement);
        $("#wmvViewer").attr('src', newElement);
        //alert(videoToPlay);
    break;
}
}
function returnVideos(){
$("#videoTable").attr("style","display:block;");
$("#videoPlayer").attr("style","display:none;");
}

基本上在 switch 语句中，根据用户按下查看的视频，我想更改以下参数；

和

将所有这些值更改为声明的新视频文件。上面的不同情况是我尝试过的不同的事情，但没有任何效果。任何帮助将不胜感激。谢谢你们！

4

2 回答 2

1

经过一些研究，我发现最好的方法是在我的 switch case 中用代码重建整个对象元素，并将其添加到 div 的 .html() 属性中，这是成功的。

function playVideo(x){
    $("#videoTable").attr("style","display:none;");
    $("#videoPlayer").attr("style","display:block;");
    $("#videoPlayer").html("");

    var videoToPlay = x;
    switch(videoToPlay){
        case 'tradingOverview':
            //alert(videoToPlay);
            var newElement = "<object id='objViewer' width='250' height='250' type='video/x-ms-asf' data='Wildlife.wmv' classid='CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6'><param name='url' value='Wildlife.wmv'><param name='filename' VALUE='Wildlife.wmv'><PARAM name='autostart' VALUE='0'><param name='uiMode' value='full'><param name='autosize' value='1'><param name='playcount' value='1'><EMBED TYPE='application/x-mplayer2' src='Wildlife.wmv' NAME='MediaPlayer' id='wmvViewer' autostart='false' WIDTH='250' HEIGHT='250' ShowControls='1' ShowStatusBar='0' ShowDisplay='0'></EMBED></OBJECT><br/><a onclick='returnVideos();'>Return to Videos</a>";
            $("#videoPlayer").html(newElement);
        break;
        case 'multiAccount':
            //alert(videoToPlay);
            var newElement = "<object id='objViewer' width='250' height='250' type='video/x-ms-asf' data='BabyBoyMainBackground.wmv' classid='CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6'><param name='url' value='BabyBoyMainBackground.wmv'><param name='filename' VALUE='BabyBoyMainBackground.wmv'><PARAM name='autostart' VALUE='0'><param name='uiMode' value='full'><param name='autosize' value='1'><param name='playcount' value='1'><EMBED TYPE='application/x-mplayer2' src='BabyBoyMainBackground.wmv' NAME='MediaPlayer' id='wmvViewer' autostart='false' WIDTH='250' HEIGHT='250' ShowControls='1' ShowStatusBar='0' ShowDisplay='0'></EMBED></OBJECT><br/><a onclick='returnVideos();'>Return to Videos</a>";
            $("#videoPlayer").html(newElement);
        break;
        case 'globalUnlock':        
            var newElement = "<object id='objViewer' width='250' height='250' type='video/x-ms-asf' data='Panel_Mask.wmv' classid='CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6'><param name='url' value='Panel_Mask.wmv'><param name='filename' VALUE='Panel_Mask.wmv'><PARAM name='autostart' VALUE='0'><param name='uiMode' value='full'><param name='autosize' value='1'><param name='playcount' value='1'><EMBED TYPE='application/x-mplayer2' src='Panel_Mask.wmv' NAME='MediaPlayer' id='wmvViewer' autostart='false' WIDTH='250' HEIGHT='250' ShowControls='1' ShowStatusBar='0' ShowDisplay='0'></EMBED></OBJECT><br/><a onclick='returnVideos();'>Return to Videos</a>";
            $("#videoPlayer").html(newElement);
            //alert(videoToPlay);
        break;
    }
}
于 2013-08-28T15:48:02.520 回答
0

晚上好。我遇到了同样的问题，从本地存储上的文件更改对象的源参数，该对象旨在显示虚拟现实场景。在 JavaScript 中设置 param 对象的相应属性值无法设置所选媒体文件的源路径。

所以确实，它必须从代码中创建一个播放器对象的新实例，并在每次更改源时再次添加到 HTML 文档中。最简单的方法是将“objViewer”对象添加到您已经定义的 div HTML 元素中，该元素的 id="videoPlayer"。您可以使用 innerHTML 属性从该 div 中删除查看器对象，方法如下：

var str; 
// Set the statements, as the object it's written in HTML... 
// 

var panel = document.getElementById("videoPlayer"); 
panel.innerHTML = ""; 
panel.innerHTML = str;

str 变量字符串以前是用 HTML 代码设置的，因为对象是用 HTML 文件编写的，但参数“filename”和“url”的值发生了变化。

这是 JavaScript 中的一个函数，通过我可以设置我的查看器控件，只要我想更改正在显示的场景的路径：

var path = String.fromCharCode(34); 
path = path.concat(document.getElementById('ID_FILE1').value); 
path = path.concat(String.fromCharCode(34)); 

if (path == '""') return;           
if ((path.indexOf('.wrl') == -1) && (path.indexOf('.wrz') == -1)) return; 

var str = '<OBJECT width="800" height="600" classid="CLSID:86A88967-7A20- 
    11d2-8EDA-00600818EDB1">'; 
str = str.concat(String.fromCharCode(13)); 
str = str.concat(' <PARAM id="paramID" name="Scene" value=')
str = str.concat(path); 
str = str.concat('>'); 
str = str.concat(String.fromCharCode(13)); 
str = str.concat(' id="viewerID" </OBJECT>'); 
str = str.concat(String.fromCharCode(13)); 

var panel = document.getElementById("ID_PANEL1"); 
panel.innerHTML = ""; 
panel.innerHTML = str;

您必须根据需要更改参数名称及其值。如果必须将控件显示到新页面中，则可以使用 body 元素代替该分区，

var wnd = window.open("", "explorer"); 
var doc = wnd.document; 

wnd.name = "Viewer";            
doc.body.innerHTML = str; 

var param = doc.getElementById("paramID"); 
param.setAttribute("name", "Scene"); 
param.setAttribute("value", path); 

wnd.focus(); 

str = '<EMBED width="1340" height="670" src='; 
str = str.concat(path); 

doc.writeln(str);           
doc.writeln(' type="application/x-cortona"'); 
doc.writeln(' pluginspage="http://cortona3d.com/cortona"'); 
doc.writeln(' contextmenu="true" vrml_background_color="#CDCDCD" 
    vrml_dashboard="true" id="viewerID">');             

doc.getElementById("viewerID").setAttribute("Scene", path);

实际上参数的属性也应该设置，因为我有一个额外的参数，否则无法更改其值。

我希望，这种方法会有所帮助。亲切的问候，阿德里安·布里纳斯。

于 2022-01-21T21:31:53.877 回答