2011-08-31 35 views
6

Có cách nào để theo dõi số lần phát cho video được nhúng không? Lý tưởng nhất là không sử dụng hình thu nhỏ được liên kết để khởi chạy mã nhúng/iframe.Làm cách nào để theo dõi sự kiện nhấp của video được nhúng (youtube, vimeo, v.v ...)? (để theo dõi số lượt chơi)

Ví dụ (thử nó cho mình trên jsFiddle):

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Example</title> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> 
</head> 
<body> 
    <div id="log"></div> 
    <ul> 
     <li class="video" id="video1"><iframe width="480" height="390" src="http://www.youtube.com/embed/z6lL83wl31E" frameborder="0" allowfullscreen></iframe><li> 
     <li class="video" id="video2"><iframe src="http://player.vimeo.com/video/28231570?title=0&amp;byline=0&amp;portrait=0" width="400" height="225" frameborder="0"></iframe></li> 
     <li class="video" id="video3"><embed flashVars="playerVars=autoPlay=no" src="http://www.metacafe.com/fplayer/3153323/the_three_stooges_minisode_beer_barrel_polecats_season_1_episode_0008.swf" width="440" height="248" wmode="transparent" allowFullScreen="true" allowScriptAccess="always" name="Metacafe_3153323" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed></li> 
    </ul> 
    <script> 
     /* Here's what I've tried so far: */ 
     $('.video').mouseover(function(){ 
      $('#log').html('Mouseover!'); 
      /*alert('Track mouseovers instead? Is this the best I can do?');*/ 
     }); 
     $('.video').mouseout(function(){ 
      $('#log').html('&nbsp;'); 
     }); 
     $('.video').mousedown(function(){ 
      $('#log').html('Mousedown!'); 
      alert('mousedown'); 
      /* This will track mousedown events in embed objects (not iframes), but not allow the click event to pass through to object. */ 
     }); 
    </script> 
</body> 
</html> 

Làm thế nào tôi có thể theo dõi số lần nghe nhạc cho mỗi người trong các video?

Trả lời

7

Ryan, cách duy nhất để làm điều này là sử dụng (các) trình phát của trang chia sẻ video, vì html và javascript không có hỗ trợ gốc cho việc này.

Để làm điều này cho video youtube, bạn có thể kiểm tra các tài liệu here

Để làm điều này cho video Vimeo, bạn có thể kiểm tra các tài liệu here

4

này làm việc cho Vimeo ... Kích hoạt một javascript cảnh báo về sự kiện "Phát" nhưng có một số sự kiện khác như "hoàn thành", "tạm dừng", "playProgress" (liên tục cập nhật trong khi đang phát video) ... Sử dụng Jquery

$(document).ready(function() { 

var f = $('iframe'), 
    url = f.attr('src').split('?')[0], 
    status = $('.status'); 

// Listen for messages from the player 
if (window.addEventListener){ 
    window.addEventListener('message', onMessageReceived, false); 
} 
else { 
    window.attachEvent('onmessage', onMessageReceived, false); 
} 

// Handle messages received from the player 
function onMessageReceived(e) { 
    var data = JSON.parse(e.data); 

    switch (data.event) { 
     case 'ready': 
      onReady(); 
      break; 

     case 'play': 
      onPlay(); 
      break; 

    } 
} 

// Call the API when a button is pressed 
$('button').on('click', function() { 
    post($(this).text().toLowerCase()); 
}); 

// Helper function for sending a message to the player 
function post(action, value) { 
    var data = { method: action }; 

    if (value) { 
     data.value = value; 
    } 

    f[0].contentWindow.postMessage(JSON.stringify(data), url); 
} 

function onReady() { 
    status.text('ready'); 
    post('addEventListener', 'play'); 
} 

function onPlay() { 
     alert("Dude done clicked 'Play'"); 
} 

}); 
Các vấn đề liên quan