javascript - jquery クリックしてビデオを再生

Question

サーバーから動的に構築された html テーブルを取得しました。最終的に、次のようなテーブルが得られます。

<div id="player"></div>

<table id="webcam-table">
            <thead>
            <tr>
                <th>Camera Name</th>
                <th>Date Created</th>
            </tr>
            </thead>
            <tbody>             
            <tr >
                <td onclick="DoNav('http://myserver.com:1935/recordings/myfile1.mp4');">
                    Default camera 
                </td>
                <td onclick="DoNav('http://myserver:1935/recordings/myfile1.mp4');">
                    06 May 2012 07:25:01 
                </td>
                </tr>

            <tr >
                <td onclick="DoNav('http://myserver.com:1935/recordings/myfile2.mp4');">
                    Default camera 
                </td>
                <td onclick="DoNav('http://myserver.com:1935/recordings/myfile2.mp4');">
                    06 May 2012 07:24:47 
                </td>
                </tr>
</tbody></table>

誰かがテーブルの行をクリックすると、DoNav 関数が呼び出されてビデオが挿入されます。

function DoNav(theUrl)
{
   var mydiv = $("#player");
   var myvideo = $("<video id='myfileplayer' src='"+ theUrl +"' width='280' height='200' controls></video>");
   $mydiv.append($myvideo);
   $(myvideo).click(function(){
       $mydiv.show();
});
}

現在、行をクリックしてもビデオが表示されません。iDevices 用にこのコードを作成しているため、デバッグ情報を取得するのは困難です。しかし、javascript エラーは表示されないようです。私は何を間違っていますか？

Answer 1

で変数を参照しているようです$

var mydiv

mydiv.propertynot経由でアクセスできます$mydiv.property

マークアップのすべてのテーブル列にonも使用するのではなく、jQuery 関数を確認する必要があります。onclick

Answer 2

$mydiv.append($myvideo);tryの代わりにtoと tomydiv.append($myvideo); も変更$(myvideo).clickmyvideo.click$mydiv.show();mydiv.show();

Answer 3

function DoNav(theUrl)
{
   var mydiv = $("#player");
   var myvideo = $("<video id='myfileplayer' src='"+ theUrl +"' width='280' height='200' controls></video>");
   mydiv.append(myvideo);
   $("#myfileplayer").click(function(){
       //$(this).load(); //active this later
       $(this).play();
   });
}