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

Ways to debug your jQuery or JavaScript codes

Debugging your client code is rather a normal procedures for any web developers. Everyone will shout Firebug! yeah, me too. But Firebug is great for syntax detection but how about logic problem? In this article i will share with you some of the ways i used to debug my JavaScript or jQuery codes when I’m developing my web application. I will also share with you a trick that i used on my code to alert me that a bug occurs in a particular script since i don’t get many helpful users nowadays.

Alert Them Out

The most simple and basic way of debugging is by using JavaScript alert function. This is old but is quite useful sometimes. Especially when you do not want to remember other debugging methods. It’s pretty simple, alert the message you want to see. If the alert doesn’t appear, this means that the error is before the alert statement. I usually do this when I’m debugging IE although there are tools available for IE.

JavaScript代码
  1. alert("The Bug Is Somewhere Before ME!");  

 

Log them up

Well, if you are using WebKit browsers for your development (FireFox, Chrome, Safari) you may want to try this.

JavaScript代码
  1. if (window.console)  
  2.     window.console.log("The Bug is killing me");  

 

What this does is to log the string ‘The Bug is killing me’ into the console such as Firebug. It’s always better than using alert and see this infinity loop that keep popping out until you are force to shut down your browser!

Log them with jQuery

The above two methods work both in jQuery and JavaScript. But this only function well in jQuery. This is definitely not something i came up with but its from Dominic Mitchell

JavaScript代码
  1. jQuery.fn.log = function (msg) {  
  2.     console.log("%s: %o", msg, this);  
  3.     return this;  
  4. };  

 

 The above creates a function, ‘log’. This function will do exactly similar to the one above but the differences is that it format the string a little bit before displaying out to the console. This is good for debugging your long chaining with jQuery. Although the previous method also can be used to debug chaining but it will required an additional line instead of including it into the chaining process. So you can debug this way,

JavaScript代码
  1. $(root).find('li.source > input:checkbox').log("sources to uncheck").removeAttr("checked");  

Try and catch

In JavaScript, you can try to catch the error in a particular scope. This way, it won’t propagate to other section of the code.

JavaScript代码
  1. try  
  2. {  
  3.   //Run some code here  
  4. }  
  5. catch(err)  
  6. {  
  7.   //Handle errors here  
  8. }  

 

 This is pretty good when you are trying to debug one of the many function in your JavaScript.

Catch them all

The last one i am going to show you is to catch any one of the error into a particular function instead of using multiple try and catch.

JavaScript代码
  1. function handleError(e)  
  2. {  
  3.     alert(’An error has occurred!\n’+e);  
  4.     return true;  
  5. }  
  6. window.onerror = handleError;  

This will handle any error occurs in your JavaScript code to the function ‘handleError’. You will want to use this at the end of your script. Especially if you want to be informed whether a particular function or script has malfunction and the users are not reporting. Basically, what you can do is to gather all information and placed them into a String or JSON. Using ajax to delivery these information to your email or database. This way, your support team will have an idea which part are having problems and your system will be more reliable. (testing doesn’t means 100% bug free) The information that you may want to know are usually located at Navigator Object in JavaScript.

Summary

These are the methods i usually look at when debugging my own client script. It might not be everything but i hope it can be useful to some of you out there. Hope you learn something!

 

原文来自于:http://hungred.com/2009/08/04/useful-information/ways-debug-jquery-javascript-codes/

Author: Clay Lua

 

 

互联网时代,每天都是新闻,篱笆域名被封

互联网时间,每天都有一些新闻啊。
这不,前段时间it168,51,博客大巴刚刚关掉没多久,现在篱笆网也被关掉了。去新网查一下,输入域名:

大小: 24.88 K
尺寸: 386 x 290
浏览: 1332 次
点击打开新窗口浏览全图

然后会弹出:

大小: 24.69 K
尺寸: 498 x 257
浏览: 1369 次
点击打开新窗口浏览全图

汗死,居然是这种原因。看来举报人或者工信部之类的对于这类事情很痛恨啊。

不过。liba.cn还是可以访问的。。论坛嘛 ,又换了域名了。不知道下一个会是谁去举报。。。真有意思。还好我这里不允许用户输入【是评论都需要审核】

唉。还是审核好啊。天啊,人人自危?

 

万能验证码:recaptcha

说是万能,意思是他支持多种程序语言。而且调用方式也非常简单,当然官方也有例子
Recaptcha,这是一个验证码程序,其实真的很方便,如果你一天到晚还在为着验证码被别人破解而不停的改进自己的验证码时,你可以用它;如果你不会写验证码程序,你可以用它;如果你想支持语音验证,你也可以用它;如果你想有更多的功能,当然你一样可以用它。

使用方法比较简单,大致如下:

  1. Download the reCAPTCHA Library, unzip it, and copy recaptchalib.php to the directory where your forms live.先到reCAPTCHA下载PHP类库,解压拷到你的线上目录中
  2. If you haven't done so, sign up for an API key. 准备完后,你可以注册并申请一下API
  3. Now we're ready to start modifying your code. First, we'll add code to display the CAPTCHA:然后,我们开始修改代码。首先,我们先添加显示CAPTCHA验证码的代码 
    PHP代码
    1. require_once('recaptchalib.php');  
    2. $publickey = "..."// you got this from the signup page,这里就是你刚才申请的API KEY 
    3. echo recaptcha_get_html($publickey);  

   4.In the code that processes the form submission, you need to add code to validate the CAPTCHA. Otherwise, the CAPTCHA will appear, but the answers won't be checked. The validation code looks like:在提交处理页,你需要添加CAPTCHA验证代码。否则,CAPTCHA并不会验证他们。验证代码大致如下:

PHP代码
  1. require_once('recaptchalib.php');  
  2. $privatekey = "...";  //申请的API KEY
  3. $resp = recaptcha_check_answer ($privatekey,  
  4.                                 $_SERVER["REMOTE_ADDR"],  
  5.                                 $_POST["recaptcha_challenge_field"],  
  6.                                 $_POST["recaptcha_response_field"]);  
  7.   
  8. if (!$resp->is_valid) {  
  9.   die ("The reCAPTCHA wasn't entered correctly. Go back and try it again." .  
  10.        "(reCAPTCHA said: " . $resp->error . ")");  
  11. }  

看起来是不是很简单?现在是不是不再犹豫了??

更多参考和参数可以查看这里:http://recaptcha.net/plugins/php/

 

 

 

Tags: recaptcha

恭喜cssrain重开通

在这次活动中,cssrain属于不幸阵亡的一位。期间问过cssrain的站长,仿佛还是倒在备案和其他问题上。
所幸的是,现在他开通了。别问我为什么,我也不知道,我只是从googlereader里发现了他的博客又能够被google reader看到了而己。

基于这个理由,恭喜一下,祝贺一下。毕竟这也是国内关于jQuery等前端应用博客中还算较有名的一位。

Tags: cssrain

断网了

断网,这真的让我很惊讶。我想想我的有线通费用是交到今年6月份的,再加上送的一个月,应该是到7月19日,但事实上,它确实是断了。

打电话 96877,发现是说我09年的有线电视费用没交,一般来说,上海这边有线电视费都是过完年后交的吧?我什么单子和通知都没有收到,就突然的关掉了。

原来机顶盒的功能是这样的呀,以后要当心了。有机顶盒的朋友要注意啊,说不定哪天你想看的电视节目就突然间被停掉了。【机顶盒的功能不是为了让你多看一些电视节目,而是为了让他们方便管理。可恨的是机顶盒需要经常升级,如果你晚上关掉机顶盒,有的时候升级失败的话,你就看不到电视了。只是不知道IPTV是否能看电视,如果能的话,倒情愿装IPTV了。算下来IPTV的费用也和有线通+有线电视费用差不多了】

我继续问,我的有线通费用是交了的呀。他说不行只要有一样停了。那么所有的都要停,我就觉得不可思议了,如果我以后不看电视怎么办?难道网也不让我上了?客服的回答却偏偏 就是这样。如果不用有线电视,那以后也不能用有线通。

让他退款吧。人说现在是停机状态,你只能先去营业厅开通或者做其他处理也行。想想就郁闷 。

有线电视停就停呗,我还能看所谓的6个台的。也够我看了,但你凭什么把我网络也给断了?

莫名其妙

Tags: 有线

Records:3912345678