2009年11月9日

14条JS代码编写时最佳规范

写任何编程代码，不同的开发者都会有不同的见解。但参考一下总是好的，下面是来自Javascript Toolbox发布的14条最佳JS代码编写技巧，Sofish翻译(1,2)。

1. 总是使用 ‘var’

在JavaScript中，变量不是全局范围的就是函数范围的，使用”var”关键词将是保持变量简洁明了的关键。当声明一个或者是全局或者是函数级（function-level）的变量，需总是前置”var”关键词，下面的例子将强调不这样做潜在的问题。

不使用 Var 造成的问题

var i=0; // This is good - creates a global variable
function test() {
   for (i=0; i&lt;10; i++) {
      alert("Hello World!");
   }
}
test();
alert(i); // The global variable i is now 10!

因为变量函数中变量 i 并没有使用 var 使其成为函数级的变量，在这个例子中它引用了全局变量。总是使用 var 来声明全局变量是一个很多的做法，但至关重要的一点是使用 var 定义一个函数范围的变量。下面这两个方法在功能上是相同的：

正确的函数

function test() {
   var i=0;
   for (i=0; i&lt;10; i++) {
      alert("Hello World!");
   }
}
正确的函数

function test() {
   for (var i=0; i&lt;10; i++) {
      alert("Hello World!");
   }
}

2. 特性检测而非浏览器检测

一些代码是写来发现浏览器版本并基于用户正使用的客户端的对其执行不同行为。这个，总的来说，是一个非常糟的实践。更好的方法是使用特性检测，在使用一个老浏览器可能不支持的高级的特性之前，首先检测（浏览器的）是否有这个功能或特性，然后使用它。这单独检测浏览器版本来得更好，即使你知道它的性能。你可以在 http://www.jibbering.com/faq/faq_notes/not_browser_detect.html找到一个深入讨论这个问题的文章。

例子：

more >>

2009年10月28日

根据IP返回地理位置地址以及地理经纬度的方法

今天做了一个基于Google地图的根据IP返回地理位置的接口，效果演示地址：http://js8.in/mywork/ipsearch/

可以输入域名，如：js8.in，既可以返回地理位置，并且把地理位置定位到Google地图上，并且在地图上打开气泡显示经纬度。

效果图：

关于这个IP查询接口的调用方法：http://js8.in/mywork/ipsearch/ipsearch.php?ip=你要查询的IP地址或者域名（如js8.in）

程序说明：

1、IP数据库采用了纯真IP数据库10.25日最新版，可能有时间就更新一下数据库内容。
2、获取的经纬度是根据Google的地图接口，返回的数据~对于国内的经纬度应该有一定的偏移（国家法律规定的），但是在Google上使用应该是可以的~

2009年10月19日

jQuery+google weather API轻松实现天气地图（二）

原理：通过来输入的关键词查询出城市的经纬度，然后调用google的weather接口，查出城市的天气情况，根据xml解析出来的结果返货json格式，便于代码的传输~！

这里我使用的是MapBar的地图免费API，其他的如：Google 就不做说明了～方法类似～截图如下：

现在把Mysql.php的全部代码，使用了simpleXML对Google返回的数据进行解析：
PS：关于各个城市的经纬度数据，请阅览：全国各省市，县级城市经纬度SQL数据以及js数组

<?php
  include("conn.php");
$strsql="select * from latlon where name=’".$_GET['city']."’";
    $result=mysql_db_query($mysql_database, $strsql, $conn);
    // u83b7u53d6u67e5u8be2u7ed3u679c,1 = name 2= latlon 3=weidu 4 = jingdu
    $row=mysql_fetch_row($result);
    mysql_data_seek($result, 0);
    $row=mysql_fetch_row($result);
    if(empty($row[1])){
        $re =array(        "noCity"=>"no data",
        "yes"=>0,
    );
        echo "";
    }else{
    $nlatlon= $row[4].’,’.$row[3];
    $back=$row[3]*1000000
.$row[4]*1000000;
$url=’http://www.google.com/ig/api?weather=,,,’.$back;
$xml =  simplexml_load_file($url);
$re=array(
    "yes"=>1,
"today" =>(string)($xml->weather->forecast_conditions[0]->condition['data']),
"ssd"=>(string)($xml->weather->current_conditions->temp_c['data']),
"sd"=>(string)($xml->weather->current_conditions->humidity['data']),
"fx"=>(string)($xml->weather->current_conditions->wind_condition['data']),
"icon"=>’http://www.google.com’.($xml->weather->forecast_conditions[0]->icon['data']),
"week1" =>(string)($xml->weather->forecast_conditions[1]->day_of_week['data']),
"week1zuidi" =>(int)((int)((string)($xml->weather->forecast_conditions[1]->low['data'])-32)/1.8+1),
"week1zuigao" =>(int) ((int)((string)($xml->weather->forecast_conditions[1]->high['data'])-32)/1.8+1),
"week1tianqi" =>(string)($xml->weather->forecast_conditions[1]->condition['data']),
"week1icon" =>’http://www.google.com’.($xml->weather->forecast_conditions[1]->icon['data']),
"week2" =>(string)($xml->weather->forecast_conditions[2]->day_of_week['data']),
"week2zuidi" =>(int) ((int)((string)($xml->weather->forecast_conditions[2]->low['data'])-32)/1.8+1),
"week2zuigao" =>(int) ((int)((string)($xml->weather->forecast_conditions[2]->high['data'])-32)/1.8+1),
"week2tianqi" =>(string)($xml->weather->forecast_conditions[2]->condition['data']),
"week2icon" =>’http://www.google.com’.($xml->weather->forecast_conditions[2]->icon['data']),
"week3" =>(string)($xml->weather->forecast_conditions[3]->day_of_week['data']),
"week3zuidi" =>(int) ((int)((string)($xml->weather->forecast_conditions[3]->low['data'])-32)/1.8+1),
"week3zuigao" =>(int) ((int)((string)($xml->weather->forecast_conditions[3]->high['data'])-32)/1.8+1),
"week3tianqi" =>(string)($xml->weather->forecast_conditions[3]->condition['data']),
"week3icon" =>’http://www.google.com’.($xml->weather->forecast_conditions[3]->icon['data']),
"nlatlon" =>$nlatlon,
"googleurl"=>$url,
);
}
echo json_encode($re);
    mysql_free_result($result);
mysql_close($conn);

?>

2009年9月30日

真正的jQuery的radio与checkbox取值

今天闲着没事想把爱墙做成好友飞信通知的功能，遇到一个checkbox的选择问题，由于自己喜欢使用jQuery来开发~所以对于jQuery对checkbox的取值很想搞清楚~

我试着使用网上比较多的版本，比如：$(“input[name=’fetion’]”).attr(“checked”)，

下面代码是网上的

多选框checkbox：

 $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾

more >>

2009年9月24日

jQuery插件pager修改版-更加智能

我的新版爱墙使用了jQuery的pager插件，可是对于老外的插件我实在是不敢恭维，比较难用，并且只能设置显示页面字数为奇数，如果为偶数则比设定的页数多一！并且不能自己设置每页显示多少页码，二是默认的9个页码，很不方便~

研究了一下，自己修改了下Pager插件，本次修改添加了“上下页”、“首页”、“最后一页”自己定义样式，比如：使用“上一页”“>>”“next”之类的字符，并且自动设置显示不显示上下页，首页，最后一页。
demo1 demo2

比如代码

var show2={per:6,index:{n:”首页”,m:”first”},pre:{n:”prev”,m:”prev”},next:{n:”next”,m:”next”},last:{n:”最后一页”,m:”last”}};
$(“#pager2”).pager({ pagenumber: 1, pagecount: 15, buttonClickCallback: PageClick2,show:show2 });

more >>

2009年5月2日