js 閉包，匿名函數要點; js 鍵盤輸入; js 執行文本代碼; js 非同步回呼函數，如何避免sysfader錯誤

最後更新：2018-12-07 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

(1) dom元素的onclick事件綁定到方法

dom.onclick=function(){otherfunctiong()};

使用js定義onclick觸發的函數,一定要用匿名函數,包圍被調用函數,否則被調函數會被直接執行.

例子：

正確：

                    tempA.onclick=function(){getInfo(residentInfo.ResidentID)};

　錯誤：

                    tempA.onclick=getInfo(residentInfo.ResidentID);

這種寫法會讓onclick事件發生前就直接getInfo(residentInfo.ResidentID);

(2)functionA()執行完之後回呼函數B

正確寫法：

function initInput(callback){        var aj=new ajax();    var url="../AddedHandlers/ResidentInfo.ashx?type=getAllBindInfo";    aj.post(url,null,false,function(info){     ..........     if(callback!=null){callback();}     )};       }

  initInput(function(){getInfo(id,true);});

錯誤寫法:

initInput(getInfo(id,true));

錯誤原因：會先執行getInfo方法

(3)迴圈內為dom元素繫結事件

 for(var i=0;i<n;i++){            var resiIDNode=resiBriefs[i].selectSingleNode("ResidentID");            var residentId=resiIDNode.text;            var resiNameNode=resiBriefs[i].selectSingleNode("ResidentName");            if(resiNameNode!=null){                var residentName=resiNameNode.text;                var httpstr="";                if(resiRelationNode!=null&&resiRelationNode.text!=""){                    if(resiRelationNode.childNodes[0].nodeValue=="戶主"){                        var tempA=document.createElement("a");                        tempA.style.fontWeight="bold";                        tempA.setAttribute("id",residentId);                        //tempA.onclick=function(){ alert(residentId);getInfo(residentId);}//錯誤寫法 所有dom元素繫結的參數都是for的最後一個值
　　　　　　　　　　　　　　　tempA.onclick=function(){getInfo(this.getAttribute("id"));}　　　　//正確寫法                        tempA.appendChild(document.createTextNode(residentName));                        document.getElementById("peopleList").appendChild(tempA);                    }
　　　　　　　　　　}
　　　　　　　　}
　　　}

二、鍵盤輸入

/*body keypressed
*/
function bodyKeyPressed(){
if(event.keyCode==13){checkUsrPsw();}
}

三、執行文本代碼

Function; eval

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>無標題頁</title><script type="text/javascript" >function execute(){    /*方式1    var sScript="(function(){"+document.getElementById("txScript").value+"})()";//執行函數    var func=new Function(sScript); //Function的最後一個參數預設是函數體    try{        func();     }*/    //方式2    var sScript=document.getElementById("txScript").value;    try{        eval(sScript);    }    catch(e){        alert(e.description);    }}</script></head> <body><textarea id="txScript" style=" width:400px; height:300px;"></textarea></br><input type="button" value="執行js代碼" onclick ="execute()"/></body></html>

三、js 非同步回呼函數，如何避免sysfader錯誤

背景:經常需要將回呼函數綁定到匿名函數上，如果綁定語句未生效,就會在方法執行後引發sysfader.

例子：三維社區系統，更新房間位置.

解決方式：在執行非同步方法呼叫前(createPoint)，檢查用戶端回呼函數書否綁定正確.

  var type=obj.getAttribute("litype");    top.usearth.Event.OnPoiClicked=top.emptyPoiClicked;//禁止點擊效果，防止sysfader    //添加點        top.usearth.Event.OnCreatePoint=function(pVal){          .......................            var endStr="The event is well set";    };    top.usearth.ShapeCreator.Clear();    try{       if(top.usearth.Event.OnCreatePoint.toString().indexOf('The event is well set')!=-1){//檢測OnCreatePoint是否綁定正常         top.usearth.ShapeCreator.createPoint();       }       else{ throw "位置移動失敗,請重新移動";}    }        catch(e){       alert(e);       return;    }

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More