Question

我正在研究Ruby on Rails 2.3.8以及rails tinyMCE插件的最新版本。

我希望用户能够将所有类型的视频添加到文本编辑器中。就像现在一样，他们可以添加Youtube视频，也可以从他们的计算机上传。

问题在于Vimeo视频不仅会创建一个公共HTML <object>代码，而且会为它们创建一个iframe，如果我尝试使用Media插件导入其中一个，我必须粘贴此视频，例如：http://vimeo.com/16430948，它会生成以下HTML（不起作用）：

<object width="100" height="100" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">
<param value="http://vimeo.com/16430948" name="src"><embed width="100" height="100" type="application/x-shockwave-flash" src="http://vimeo.com/16430948">
</object>

虽然Vimeo视频需要显示以下HTML：

<p><iframe frameborder="0" height="225" src="http://player.vimeo.com/video/16430948" width="400"></iframe></p>
<p>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="100" width="100">
<param name="src" value="http://vimeo.com/16430948" /><embed src="http://vimeo.com/16430948" width="100" height="100" type="application/x-shockwave-flash"></embed>
</object>

现在，这两个生成的HTML之间的区别是什么？我发布的第一个代码中缺少iframe，所以它不起作用。

所以，问题是：如何将iframe添加到tinyMCE可编程性中，以便在嵌入Vimeo视频时自动添加？

Answer 1

好吧，您应该write your own plugin (it is pretty simple)检查用户所做的更改。当用户输入vimeo链接时，您只需从编辑器中获取相关内容并将其放入新元素（iframe）中。

你的代码应该是这样的（你必须修改它，但我相信你会得到正确的方向）：

// you may choose an other event to check for
ed.onChange.add(function(ed){

  var body = ed.getBody();

  // check for vimeo using jquery object
  $(body).find('param').each(function(index, Element){
    // vimeo adress is found in value
    if (this.value.search('http://vimeo.com') == -1) return;
    var node = this;
    var iframe_not_parent = 1;    
    while(node.nodeName !== 'body'){
      node = node.parentNode;
      if (node.nodeName !== 'iframe'){
        iframe_not_parent = 0; 
        break;
      }
    }

    // ok, this vimeo thing is not inside an iframe - put it inside
    if (iframe_not_parent){

        with(document.getElementById(iframe_id).contentWindow){         
          var new_iframe = document.createElement("iframe");
          this.parentNode.parentNode.append(new_iframe);
          new_iframe.append(this.parentNode);
        }
    }
  });
});

如何使用媒体插件上传vimeo视频（而不是HTML选项）

1 个答案: