手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 注册 | 登陆
浏览模式: 标准 | 列表分类:Javascript

setInterval的郁闷之处

使用这个函数还是有点小郁闷的。网上的资料现在大多被AS的资料所覆盖,一般来说setInterval是传递两个参数,这与setTimeout 一样,第一个是方法,第二个是时间,但由于网上找的大多是AS下的setInterval,这就造成了理解错误,正常情况下AS下的 setInterval的参数也是(方法,时间),但setInterval也可以是(对象,方法,时间),甚至更多的参数用来传递给方法。

那么,JS下面的setInterval怎么使用对象中的方法呢?其实很简单,直接使用连接符就行了:setInterval("对象.方法()" , 时间 ),但参数好象是没有办法传递的,如果实在要传,你就只要自己写同名方法覆盖掉系统的setInterval了。

网上有个例子,但我没有运行成功,所以我也不在这里贴出来,主要还是那个callee,arguments这些东东,网上也有很多例子,类似于PHP的func_get_args,利用这个进行伪重载。

呵呵

Tags: setinterval

扩展JQuery Ajax请求错误机制

如何对ajax的错误进行更好的处理?本文给出了一个简单的解决方案。想当于类的扩展和继承一样。有新意,一直以来,对于框架我们要么是扩展,要么是写新方法,就从来没有想过要继承这些方法。所以,作者这个给了我很多启发。

原文:http://www.cnblogs.com/lyk831216/archive/2009/04/24/1442791.html

JQuery使我们在开发Ajax应用程序的时候提高了效率,减少了许多兼容性问题,但时间久了,也让我们离不开他。比如简单的Jquery Ajax请求的封装让我们忘却了最原始的XmlHttpRequest对象和他的属性,方法,也让我们远离事情的真相。

在Ajax项目中,经常遇到需要服务器端返回错误的消息提示,或者消息码之类的数据。查过一些帮助,解决方案,很多网站是返回错误的消息JSON数据或者 脚本,这种方式当我们用JQuery.ajax()的时候出现了问题,jquery.ajax()回调函数success(data)的data参数可能 是 xmlDoc, jsonObj, html, text, 等等...这取决于我们dataType设置和MIME.很多时候我们的错误处理都是统一的处理,不管你请求的是XML,JSON...。不光不好统一, 还容易出现解析错误等等情况。

参考了Prototyp框架的做法,做了一个Jquery的错误扩展。

原理:Prototype思路是把服务器处理结果状态信息写在Header里面,这种方式既保证了reponse body的干净,同时适应XML,JSON,HTML,Text的返回情况。

   服务器端只需要 Response.AddHeader("Error-Json""{code:2001,msg:'User settings is null!',script:''}");

实现:为了不影响原有的Jquery.ajax方法,同时不破坏jquery库源文件,做了如下扩展,代码很简单都能看懂:

JavaScript代码
  1. ;(function($){  
  2.     var ajax=$.ajax;  
  3.     $.ajax=function(s){  
  4.         var old=s.error;  
  5.         var errHeader=s.errorHeader||"Error-Json";  
  6.         s.error=function(xhr,status,err){  
  7.             var errMsg = window["eval"]("(" + xhr.getResponseHeader(errHeader) + ")");  
  8.             old(xhr,status,errMsg||err);  
  9.         }  
  10.         ajax(s);  
  11.     }  
  12.   
  13. })(jQuery);   

使用方法:

  服务器端:我们是对错误进行扩展,如果要让jquery.ajax破获[膘叔:应该为捕获]错误,必须要服务器端返回非200的错误码,由于Opera浏览器下面对 400以上的错误码,都无法获得请求的Header,建议如果要支持Opera,最好返回30*错误,这是Opera能接受Header的错误范围。没有 做包装,可以再单独把Catch内容出来。

C#代码
  1. try {  
  2.     context.Response.Write(GetJson(context));  
  3.     throw new Exception("msg");  
  4. }  
  5. catch {  
  6.     context.Response.ClearContent();  
  7.     context.Response.StatusCode = 300;  
  8.     context.Response.AddHeader("Error-Json""{code:2001,msg:'User settings is null!',script:''}");  
  9.     context.Response.End();  
  10. }  

 客户端:

JavaScript代码
  1. $.ajax({  
  2.     url: this.ajaxUrl,  
  3.     type: "POST",  
  4.     success: callback,  
  5.     error: function(xhr,status,errMsg){  
  6.     alert(errMsg.code+"<br/>"+errMsg.msg);  
  7.     }  
  8. });  

也许不是最好的,但觉得用起来很方便,忘了个写新增参数errorHeader:"Error-Json",这个header头key根据你后台设定配置。

 

 

 

Tags: jquery, 扩展

js控制网页播放器MEDIA PLAYER的相关知识

没想过要用这个东西,但群里有人问,这个地址也是群里的朋友贴出来的,仔细想想这个东西也有应用的场景,比如歌词的控制。能够得到播放时间,就能够控制歌词的显示了。估计那些用JS做的播放器大致都是这样的吧?猜测而已

内容如下:http://roln.cn/archives/80

<!–播放器 开始–>
 <object id=”Exobud” style=”width: 273px; height: 64px” type=”application/x-oleobject”
  classid=”CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6″>
  <param name=”URL” value=”"/>
  <param name=”rate” value=”1″/>
  <param name=”balance” value=”0″/>
  <param name=”currentPosition” value=”0″/>
  <param name=”defaultFrame” value=”"/>
  <param name=”playCount” value=”1″/>
  <param name=”autoStart” value=”-1″/>
  <param name=”currentMarker” value=”0″/>
  <param name=”invokeURLs” value=”-1″/>
  <param name=”baseURL” value=”"/>
  <param name=”volume” value=”80″/>
  <param name=”mute” value=”0″/>
  <param name=”uiMode” value=”full”/>
  <param name=”stretchToFit” value=”-1″/>
  <param name=”windowlessVideo” value=”0″/>
  <param name=”enabled” value=”-1″/>
  <param name=”enableContextMenu” value=”0″/>
  <param name=”fullScreen” value=”0″/>
  <param name=”SAMIStyle” value=”"/>
  <param name=”SAMILang” value=”"/>
  <param name=”SAMIFilename” value=”"/>
  <param name=”captioningID” value=”"/>
  <param name=”enableErrorDialogs” value=”0″/>
  <param name=”_cx” value=”7223″/>
  <param name=”_cy” value=”1693″/>
 </object> <!–播放器 结束–>
1 单项播放很简单,这里粗略的说一下
 通过网页传参在后台cs页面绑定一个变量
html
<param name=”URL” value=”<% = Url%>”/>
cs
public string Url;
Url = 从数据库中读取

2 让播放器播放多首歌曲并循环播放呢
思路就是建一个播放列表,然后通过js来控件.

第一种方法 (此方法最终行不通)
建立一个数组相当于播放列表alist(假设这是用户选择歌曲后的结果)

js
var num = 0
function Onload(){
var Exobud = document.getElementById(”Exobud”);
Exobud.URL = alist[num];
Exobud.controls.play();
num ++;
}
通过PlayStateChange监听播放状态 ,8表示播放结束
<script for=”Exobud” EVENT=”PlayStateChange(stats)”>
if(stats == 8 )
Exobud.URL = alist[num];
Exobud.controls.play();
//alert(Exobud.URL);
num ++
</script>
到此播放正常,当播放下一首歌的时候就定住了.非要手动去点播放.不知道是何原因?
在网上查,有一仁兄弟好像解决过这问题,说是放第二首歌的时候,仍然是在第一首歌的播放状态下,所以就一直是停的.
解决办法,就是每首歌只播放一次,但不知道改那里.播放器参数中每首歌是设的播放一次.
另一种办法就是加一个alert(Exobud.URL);这样就可以自动播放,但总弄个弹窗不好吧.
到现在还没弄明白是么回事.如有人知道请留言跟贴,帮我解决一哈.

第二种方法.现已解决.能正常使用. 思路就是用setTimeout()不停的循环,然后控件播放列表的索引得到值来改变URL

先建立一个播放列表
假设用户所选的歌曲参数已传过来
播放列表如下
<select name=”SongList” size=”5″ >
        OnDblClick=”player();”>
            <option value=”songs/001.mp3″>001</option>
            <option value=”songs/002.wma”>002</option>
            <option value=”songs/003.WMV”>003</option>
            <option value=”songs/004.mp3″>004</option>
            <option value=”songs/005.wma”>005</option>
 </select>
同时设置几个按钮
<a href=”#” onclick=”javascript:play();”>on</a>
<a href=”#” onclick=”javascript:Last_OneOK();”>last</a>
<a href=”#” onclick=”javascript:Next_OneOK();”>next</a>

js
<script language=”JavaScript”>
        //var server=’http://localhost/music/’;
        var SongList = document.getElementById(”SongList”);
        var Exobud = document.getElementById(”Exobud”);
        var TotalSongs = SongList.options.length;
        function play()
        {
        SongList.options[0].selected=true;
        player();
        }
        function player(){
      if(SongList.selectedIndex < 0) alert(’系统错误,请选择您要播放的曲目!’);
      else{
      var url;
      url = SongList.options[SongList.selectedIndex].value;
      Exobud.URL=url;
      //alert(TotalSongs);
      Exobud.controls.play();
      showTLab();
      return;
      }
        }
   
        function showTLab(){
      if(Exobud.playState == 1)
      Next_OneOK();
      setTimeout(”showTLab()”, 1000);
        }
   
        function Next_OneOK(){
      if(SongList.selectedIndex >= 0){
      if(SongList.selectedIndex < TotalSongs-1){
       SongList.options[SongList.selectedIndex + 1].selected = true;
        player();
      }else{
       SongList.options[0].selected = true;
        player();
      }
       }
         }
         function Last_OneOK(){
      if((SongList.selectedIndex > 0) && (SongList.selectedIndex < TotalSongs)){
      SongList.options[SongList.selectedIndex - 1].selected = true;
      player();
         }
         }
    </script>

这样问题就解决了.
注音乐文件都是我本地的

附上media player的一些控制方法

player.controls.play(); 播放
player.controls.stop(); 停止
player.controls.pause(); 暂停
player.controls.currentPosition 返回播放文件的当前时间位置(以秒为单位)
player.controls.currentPositionString 时间格式的字符串 “0:32″
player.currentMedia.duration 返回播放文件的总长度(以秒为单位)
player.currentMedia.durationString 时间格式的字符串 “4:34″
player.settings.volume 音量 (0-100)
player.settings.balance 声道,通过它应该可以进行立体声、左声道、右声道的控制。但对应的取值尚不清楚。
player.settings.mute = s 静音(s取值为true和false)
player.closedCaption.CaptioningID 网页中出现字幕的容器的ID
player.closedCaption.SAMIFileName 字幕文件地址
player.playState 返回播放器状态( 3:正在播放,2:暂停1:已停止)

Tags: 播放器

很妖的实现:以JSon来实现TextBox可选择可输入

这个实现方式有点妖。
原文是用asp.net实现的。我也没有改,因为,json数据的获取在PHP中真是太简单了。拿到数据后json_encode一下就全有了。。

想看的就做个参考吧。我还是觉得妖
     这里只是把主要的代码贴出来,不再进行过多的说明,重要的地方以注释的方式进行说明。

XML/HTML代码
  1.     <div id="pubDiv" style="background-position: #9999FF; font-size:12px; display:none; z-index:0; overflow:auto; position:absolute; border:#EDEDED 0px solid;background:#EDEDED;"></div>  
  2.     <script type="text/javascript" language="javascript">  
  3.       // 注意下面的等号右面,不能是“<%=BuildJson() %>”,因为JSon整体不能是字符串,同时最后也不能加分号:“;”  
  4.         var strJson = <%=BuildJson() %>  
  5.          
  6.         function ShowBdzDiv() {  
  7.             var dept = document.getElementById("<%=ddlDeptEdit.ClientID %>").value;  
  8.             // 构建要下拉选择的内容  
  9.             var strHtml = "<table border=0px cellpadding=0  cellspacing=0 width=120px><tr>";  
  10.             for (var key in strJson[dept]) {  
  11.                 strHtml += "<tr><td onclick=SetBdz()>" + key + "</td></tr>";  
  12.             }  
  13.             strHtml += "</table>";  
  14.             var oBdz = document.getElementById("<%=txtBdz.ClientID %>");  
  15.             var oDiv = document.getElementById("pubDiv");  
  16.             oDiv.innerHTML = strHtml;  
  17.   
  18.             // 设置显示的位置,并显示  
  19.             oDiv.style.top = "99px";  
  20.             oDiv.style.left = "100px";  
  21.             oDiv.style.display = "block";  
  22.   
  23.         }  
  24.         // 当点击选择一个内容时  
  25.         function SetBdz() {  
  26.             var oBdz = document.getElementById("<%=txtBdz.ClientID %>");  
  27.             // 把选择内容设置到TextBox上,并隐藏下拉选择项  
  28.             oBdz.value = event.srcElement.innerText;  
  29.             HiddenDiv();  
  30.         }  
  31.         // 隐藏下拉选择项  
  32.         function HiddenDiv() {  
  33.             var oDiv = document.getElementById("pubDiv");  
  34.             oDiv.style.display = "none";  
  35.         }  
  36.     </script>  
  37. 。。。  
  38. <!--这里只有一点要注意:设置AutoCompleteType="Disabled"-->  
  39. <asp:TextBox ID="txtBdz" AutoCompleteType="Disabled" onfocus="ShowBdzDiv()" runat="server"></asp:TextBox>  

 

这里要说明的是,这里只实现了下拉选择项的点击选择,不能使用键盘操作。

Tags: json

FCK常用操作

 

JavaScript代码
  1. 1、获取编辑器中HTML内容  
  2. function getEditorHTMLContents(EditorName)  
  3. {  
  4.      var oEditor = FCKeditorAPI.GetInstance(EditorName);  
  5.      return(oEditor.GetXHTML(true));  
  6. }  
  7. 2、获取编辑器中文字内容(无html代码)  
  8. function getEditorTextContents(EditorName)  
  9. {  
  10.      var oEditor = FCKeditorAPI.GetInstance(EditorName);  
  11.      return(oEditor.EditorDocument.body.innerText);  
  12. }  
  13. 3、设置编辑器中内容  
  14. function SetEditorContents(EditorName, ContentStr)  
  15. {  
  16.      var oEditor = FCKeditorAPI.GetInstance(EditorName) ;  
  17.      oEditor.SetHTML(ContentStr) ;  
  18. }  

 

Yhustc说道:
  1. function InsertHTML(html) {  
  2.     var oEditor = FCKeditorAPI.GetInstance("editor") ;  
  3.     if (oEditor.EditMode == FCK_EDITMODE_WYSIWYG ) {  
  4.         oEditor.InsertHtml(html) ;  
  5.     }else  
  6.         alert( "FCK必须处于WYSIWYG模式!" ) ;  
  7. }  

Tags: fck