Javascript 当我'；你是以编程方式启动的吗？

好的，交易是我开始制作一个小视频播放器，它通过点击一个带有图像的div，展开div和图像，然后用一个html5视频标签交换图像。代码如下

（这还很早，所以我知道还有很多需要改进的地方，比如不使用javascript设置样式等等，但尽管如此，除了回答主要问题外，欢迎提供任何见解和提示）

/*开始扩展器*/
变量$videoplayer=$（''）.appendTo（'body'）；
$videoplayer.hide（）；
$（“.ExpandVideo”）。每个（函数（i）{
var$trigger=$（此）；
var$image=$trigger.find（“img”）；
$image.css({
“宽度”：“100%”
，“高度”：“自动”
})
$trigger.css({
“显示”：“块”
，“溢出”：“隐藏”
“宽度”：“200px”
，“浮动”：“左”
});
$trigger.bind（“单击”），函数（e）{
$trigger.animate（{“width”：“640px”}，“fast”，function（）{
$image.replace为（$videoplayer）；
$videoplayer.show（）；
$videoplayer.attr（“id”，“video”+i）；
var video=document.getElementById（“视频”+i）；
video.play（）；
})
})
});

然而，主要的问题是，当我启动这样的视频（video.play（））时，本机控件停止工作，我无法再暂停视频，即使控件在那里，并且可以单击，当我尝试暂停视频时，视频会立即重新开始播放

---

这是一个遗憾，因为为了简单起见，我想使用本机控件。

刚刚发现我可以使用jquery设置“自动播放”-attriubute，这似乎很好。任何其他建议都是欢迎的。

刚刚发现我可以用jquery设置“自动播放”-属性，这似乎很好。我们仍然欢迎任何其他建议

/*Begin Expander*/
var $videoplayer = $('<video width="640" height="360" preload="none" controls="" tabindex="0" style="position: relative;"><source type="video/mp4" src="/restalive/movies/big_buck_bunny.mp4"></source><source type="video/ogg" src="/restalive/movies/big_buck_bunny.ogv"></source></video>').appendTo('body');

$videoplayer.hide();


$(".ExpandVideo").each(function(i){

    var $trigger = $(this);
    var $image = $trigger.find("img");

    $image.css({
          "width" : "100%"
         ,"height" : "auto"


    })

    $trigger.css({
             "display" : "block"
            ,"overflow" : "hidden"
            ,"width" : "200px"
            ,"float" : "left"
    });

    $trigger.bind("click", function(e){

        $trigger.animate({"width" : "640px"}, "fast", function(){

            $image.replaceWith($videoplayer);
            $videoplayer.show();
            $videoplayer.attr("id", "video" + i);

            var video = document.getElementById("video" + i);
            video.play();


        })

    })



});