Home  >  Article  >  Backend Development  >  jrecorder插件问题

jrecorder插件问题

WBOY
WBOYOriginal
2016-06-06 20:51:181328browse

问题是这样的:前几天我在网上下了一个插件jrecorder,这是一个不需要任何flash编程技术就可以实现在线录音的jquery插件,但问题出现了,我在http://www.sajithmr.me/jrecorder/exam... 上下了插件,也按照提示把插件装在本地服务器上,但是老是出错:Uncaught TypeError: Object # has no method 'jStartRecording' ;jStartRecording函数在jrecorder.js中:

//function call to start a recording
	$.jRecorder.record = function(max_time){
		//change z-index to make it top
	$(  '#' + jRecorderSettings['recorderlayout_id'] ).css('z-index', 1000);
    getFlashMovie(jRecorderSettings['recorder_name']).jStartRecording(max_time);
} 

本地测试时使用的代码:


<meta name="author" content="Sajith Amma">
<script src="../js/jquery.min.js"> </script>
<script src="../js/jRecorder-1.0-old.js"> </script>
<title>jRecorder Example</title>  

 
<div id="locationforrecorder" style="border:1px solid grey">
</div>  
<script>
$.jRecorder(
     
    { 
     host : 'http://localhost/nahan/recorder/acceptfile.php?filename=hello.wav' ,        
     callback_started_recording:     function(){callback_started(); },
     callback_stopped_recording:     function(){callback_stopped(); },
     callback_activityLevel:  function(level){callback_activityLevel(level); },
     callback_activityTime:     function(time){callback_activityTime(time); },
     callback_finished_sending:     function(time){ callback_finished_sending() },
     swf_path : 'jRecorder.swf',
    }
    , $('#locationforrecorder')
    );
</script>
  <div style="background-color: #eeeeee;border:1px solid #cccccc">  
    Time: <span id="time">00:00</span>  
  </div>
  <div>
    Level: <span id="level"></span>
  </div>  
  <div id="levelbase" style="width:200px;height:20px;background-color:#ffff00">
     <div id="levelbar" style="height:19px; width:2px;background-color:red"></div>  
  </div>
  <div>
    Status: <span id="status">
  </span>
</div> 
  <div>  
    <input type="button" id="record" value="Record" style="color:red">  
    <input type="button" id="stop" value="Stop">
  </div>
  <script type="text/javascript">                
    $('#record').click(function(){
      $.jRecorder.record(30);                    
   })                  
    $('#stop').click(function(){                                     
      $.jRecorder.stop();                                     
   })                  
   function callback_finished()
    {     
       $('#status').html('Recording is finished');                   
    }                  
   function callback_started()
    {      
       $('#status').html('Recording is started');
    }  
    function callback_error(code)
      {
         $('#status').html('Error, code:' + code);
      }
   function callback_stopped()
    {
      $('#status').html('Stop request is accepted');
    }
   function callback_finished_recording()
    {                    
      $('#status').html('Recording event is finished');                                       
    }
   function callback_finished_sending()
    {                    
     $('#status').html('File has been sent to server mentioned as host parameter');
    }
   function callback_activityLevel(level)
    {                    
     $('#level').html(level);                    
        if(level == -1)
         {
            $('#levelbar').css("width",  "2px");
         }
         else
         {
            $('#levelbar').css("width", (level * 2)+ "px");
         }                                        
    }
    function callback_activityTime(time)
     {                   
       //$('.flrecorder').css("width", "1px"); 
       //$('.flrecorder').css("height", "1px"); 
       $('#time').html(time);                    
     }
    
 </script>

我查看了网上那个示例的源代码,发现和我本地上的代码没有区别,所以真的很郁闷,到底哪里出错了?

回复内容:

问题是这样的:前几天我在网上下了一个插件jrecorder,这是一个不需要任何flash编程技术就可以实现在线录音的jquery插件,但问题出现了,我在http://www.sajithmr.me/jrecorder/exam... 上下了插件,也按照提示把插件装在本地服务器上,但是老是出错:Uncaught TypeError: Object # has no method 'jStartRecording' ;jStartRecording函数在jrecorder.js中:

//function call to start a recording
	$.jRecorder.record = function(max_time){
		//change z-index to make it top
	$(  '#' + jRecorderSettings['recorderlayout_id'] ).css('z-index', 1000);
    getFlashMovie(jRecorderSettings['recorder_name']).jStartRecording(max_time);
} 

本地测试时使用的代码:


<meta name="author" content="Sajith Amma">
<script src="../js/jquery.min.js"> </script>
<script src="../js/jRecorder-1.0-old.js"> </script>
<title>jRecorder Example</title>  

 
<div id="locationforrecorder" style="border:1px solid grey">
</div>  
<script>
$.jRecorder(
     
    { 
     host : 'http://localhost/nahan/recorder/acceptfile.php?filename=hello.wav' ,        
     callback_started_recording:     function(){callback_started(); },
     callback_stopped_recording:     function(){callback_stopped(); },
     callback_activityLevel:  function(level){callback_activityLevel(level); },
     callback_activityTime:     function(time){callback_activityTime(time); },
     callback_finished_sending:     function(time){ callback_finished_sending() },
     swf_path : 'jRecorder.swf',
    }
    , $('#locationforrecorder')
    );
</script>
  <div style="background-color: #eeeeee;border:1px solid #cccccc">  
    Time: <span id="time">00:00</span>  
  </div>
  <div>
    Level: <span id="level"></span>
  </div>  
  <div id="levelbase" style="width:200px;height:20px;background-color:#ffff00">
     <div id="levelbar" style="height:19px; width:2px;background-color:red"></div>  
  </div>
  <div>
    Status: <span id="status">
  </span>
</div> 
  <div>  
    <input type="button" id="record" value="Record" style="color:red">  
    <input type="button" id="stop" value="Stop">
  </div>
  <script type="text/javascript">                
    $('#record').click(function(){
      $.jRecorder.record(30);                    
   })                  
    $('#stop').click(function(){                                     
      $.jRecorder.stop();                                     
   })                  
   function callback_finished()
    {     
       $('#status').html('Recording is finished');                   
    }                  
   function callback_started()
    {      
       $('#status').html('Recording is started');
    }  
    function callback_error(code)
      {
         $('#status').html('Error, code:' + code);
      }
   function callback_stopped()
    {
      $('#status').html('Stop request is accepted');
    }
   function callback_finished_recording()
    {                    
      $('#status').html('Recording event is finished');                                       
    }
   function callback_finished_sending()
    {                    
     $('#status').html('File has been sent to server mentioned as host parameter');
    }
   function callback_activityLevel(level)
    {                    
     $('#level').html(level);                    
        if(level == -1)
         {
            $('#levelbar').css("width",  "2px");
         }
         else
         {
            $('#levelbar').css("width", (level * 2)+ "px");
         }                                        
    }
    function callback_activityTime(time)
     {                   
       //$('.flrecorder').css("width", "1px"); 
       //$('.flrecorder').css("height", "1px"); 
       $('#time').html(time);                    
     }
    
 </script>

我查看了网上那个示例的源代码,发现和我本地上的代码没有区别,所以真的很郁闷,到底哪里出错了?

把所有JS代码放到$(function() { ~~~~~~~~放置jRecorder代码~~~~~~~~~~~ })

解决了没有?

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn