MP3 Dosyaları satır içi oynatıcısı üzerinden yürütülmüyor

Question

Bir sunucu tarafı komut dosyası aracılığıyla bir mp3 dosyası verisini yükleyen bir sayfam var. Dosyaları oynatmak için ses yöneticisi eklentisini kullanıyorum, ancak satır içi oynatmıyorlar ve sadece yeni bir pencerede açıyorlar. Bunun nedeni, satır içi oynatıcının tablonun tam olarak yüklenmesinden önce başlatılmasıdır, dolayısıyla mp3 dosyalarını bulamamaktadır. Bu dosyaları inline (sayfada) oynatmak için "dinle" düğmesini nasıl alabilirim?

JavaScript:

<script src="{{asset('soundmanager/js/soundmanager2-jsmin.js')}}"></script> 
<script src="{{asset('soundmanager/js/inlineplayer.js')}}"></script> 


<script type="text/javascript"> 
$(document).ready(function() { 

    $('#uploads-table').dataTable({ 
     "bProcessing": true, 
     "bServerSide": true, 
     "bPaginate": true, 
     "destroy": true, 
     "sAjaxSource": "/api/admin/tables/uploads", 
     "order": [[5,'desc']], 
     "columnDefs": [ { //this prevents errors if the data is null 
      "targets": "_all", 
      "defaultContent": "" 
     } ], 
     "columns": [ 
     // title will auto-generate th columns 
      { "data": "name", "title": "Name", "orderable": true, "searchable": true }, 
      { "data": "description", "title": "Description", "orderable": true, "searchable": true }, 
      { "data": "file_extension", "title": "File Extension", "orderable": true, "searchable": true }, 
      { "data": "mimetype", "title": "Mimetype", "orderable": true, "searchable": true }, 
      { "data": "created_by", "title": "Created By", "orderable": true, "searchable": true }, 
      { "data": "created_at", "title": "Created At", "orderable": true, "searchable": true }, 
      { "data": "updated_at", "title": "Updated At", "orderable": true, "searchable": true }, 
      { "data": "actions", "title": "Actions", "orderable": false, "searchable": false} 
     ] 
    }); 

}); 
</script> 

Sunucu tarafı komut dosyası: Her tablo çizmek SoundManager2 player başlatmak için

$upload = Upload::select(array('id','name', 'description', 'file_extension', 'mimetype', 'created_by', 'created_at', 'updated_at', 'filename', 'is_remote')); 

    return Datatables::of($upload) 
     ->edit_column('name', '<a href="/admin/content/uploads/{{$id}}/view">{{$name}}</a>') 
     ->edit_column('created_by', function($upload) { 
      return ($upload->user ? '<a href="/admin/users/'.$upload->user->id.'/view">'.$upload->user->username.'</a>' : 'Unknown'); 
     }) 
     ->edit_column('actions', function($upload) { 

      if($upload->is_remote) { 
       $filePath = URL::to($upload->filename); 
      } 
      else { 
       $filePath = URL::to($upload->getFilePath()); 
      } 

      return ('<a href="'.$filePath.'" type="'.$upload->mimetype.'" class="sm2_link" target="_blank">Listen</a> 
       <a href="/admin/content/uploads/'.$upload->id.'/view" class="btn btn-xs btn-default">View</a> 
       <a href="/admin/content/uploads/'.$upload->id.'/edit" class="btn btn-xs btn-default">Edit</a> 
       <a data-itemname="'.$upload->name.'" data-action="/admin/content/uploads/'.$upload->id.'/delete" data-title="Delete Upload?" data-toggle="modal" href="#deleteModal" class="confirmDelete btn btn-xs btn-default">Delete</a>'); 
     }) 
     ->remove_column('id') 
     ->make(true); 

Answer 1

kullanın drawCallback seçeneği.

$('#uploads-table').dataTable({ 
    drawCallback: function(settings){ 
     // Workaround: remove click event handler from 
     // MP3 links other than the once in the table. 
     inlinePlayer.removeEventHandler(document, 'click', inlinePlayer.handleClick); 

     inlinePlayer.init() 
    }, 
    // other options 
}); 

oyuncu başlatılıyor MP3 bağlantıları yeniden taramak için zorlamak için tek yol olduğunu unutmayın. Sayfada başka MP3 bağlantılarınız varsa, bunlar iki kez başlatılabilir. Bu nedenle, oynatıcıyı yeniden başlatmadan önce tıklama olayı işleyicisini kaldırmak için çizgiyi ekledim.