0

我想创建一个带有 javascript (jQuery) 和 HTML 的富文本编辑器，其工作方式类似于“Blogger”。

我希望编辑器的用户能够添加格式化文本（粗体、不同大小的字体等）、添加图像和添加来自 YouTube 的视频。我的搜索结果显示所有基于 Web 的 RTE 都使用“document.execCommand”。虽然我找到了前两个示例（格式化文本和图像），但我没有找到任何添加视频的示例。

我尝试使用此代码（函数“测试”）但不起作用。单击按钮（theVideo）后，iframe（文本编辑器）为空。

<body onLoad="def()">
    ...
    <input type="button" id="theVideo" value="video..." onClick="test()" />
    ...
</body>

<script type="text/javascript">
function def(){
    var testframe = document.createElement("iframe");
    testframe.name = testframe.id = "textEditor";

    if (testframe.addEventListener){
        testframe.addEventListener("load",function(e){this.contentWindow.document.designMode = "on";}, false);
    } else if (testframe.attachEvent){
        testframe.attachEvent("load", function(e){this.contentWindow.document.designMode = "on";});
    }

    document.body.appendChild(testframe);

    textEditor.document.designMode="on";
    textEditor.document.open();
    html="<head><style type='text/css'>body{ font-family:arial; font-size:13px; }</style> </head>";
}

function test(){
    sembed = "<div>";

    sembed +="<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0'"; 
    sembed +="data-thumbnail-src='http://3.gvt0.com/vi/JQu2OSyFZNM/0.jpg' height='266' width='320'>";

        sembed +="<param name='movie' value='http://www.youtube.com/v/JQu2OSyFZNM&fs=1&source=uds' />";

        sembed +="<embed width='320' height='266' src='http://www.youtube.com/v/JQu2OSyFZNM&fs=1&source=uds' type='application/x-shockwave-flash' >";
        sembed +="</embed>";
    sembed +="</object>";

    sembed +="</div>";

    textEditor.document.execCommand("Inserthtml", "", sembed);
}
</script>

有谁知道如何将视频添加到 iframe？不使用 execCommand 是否有其他解决方案？

4

1 回答 1

0

此代码适用于 Firefox、Chrome、IE。我没有使用 Opera 和 Safari 进行测试

<!DOCTYPE html>
<html>
<head>

<script>
function changeStyle(){
    sembed = "<div>";

         sembed +="<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0'"; 
         sembed +="data-thumbnail-src='http://3.gvt0.com/vi/JQu2OSyFZNM/0.jpg' height='266' width='320'>";

              sembed +="<param name='movie' value='http://www.youtube.com/v/JQu2OSyFZNM&fs=1&source=uds' />";

              sembed +="<embed width='320' height='266' src='http://www.youtube.com/v/JQu2OSyFZNM&fs=1&source=uds' type='application/x-shockwave-flash' >";
              sembed +="</embed>";
         sembed +="</object>";

   sembed +="</div>";

   var x=document.getElementById("myframe");
   var y=(x.contentWindow || x.contentDocument);
   if (y.document) y=y.document;

   y.open();
   y.write(sembed);
   y.close();
}

</script>
</head>

<body>

<iframe id="myframe" width=850 height=500>
    <p>Your browser does not support iframes.</p>
</iframe><br /><br />

<input type="button" onclick="changeStyle()" value="Add Video.." />

</body>
</html>
于 2012-08-24T21:29:27.863 回答