自动加载jQuery的Javascript代码示例

当我们在Javascript里需要用到jQuery但又无法判断是否加载过时,可以通过下面的方法来自动判断并加载jQuery,代码如下:

function getScript(url, success) {
    var script = document.createElement('script');
    script.src = url;
    var head = document.getElementsByTagName('head')[0],
    done = false;
    
    // Attach handlers for all browsers
    script.onload = script.onreadystatechange = function() {
        if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
            done = true;
            
            // callback function provided as param
            success();
            
            script.onload = script.onreadystatechange = null;
            head.removeChild(script);
        };
    };
    head.appendChild(script);
};

if (typeof jQuery == 'undefined') {
    alert('Not found jQuery');
    getScript('http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js', function() {
        alert('jQuery loaded');
    });
}

阳光部落原创,更多内容请访问http://www.sunbloger.com/

Javascript闭包实现Ajax在for循环中正常运行

假设我们现在需要在一个for循环中通过异步的方式向一个后端php程序请求数据,常规的写法Ajax是无法正常工作的,网上也有不少的解决方案,这里提供一个闭包方案,详细如下:

Javascript代码如下:

for (i=1; i<=10; i++) {
    (function (i) {
        $.ajax({
            type: "GET",
            url: "http://www.youdomain.com/ajax.php",
            data: "num=" + i,
            success: function(data){
                alert(data);
            }
        });
    })(i);
}

阳光部落原创,更多内容请访问http://www.sunbloger.com/

10条建议让你创建更好的jQuery插件

在开发过很多 jQuery 插件以后,我慢慢的摸索出了一套开发jQuery插件比较标准的结构和模式。这样我就可以 copy & paste 大部分的代码结构,只要专注最主要的逻辑代码就行了。

使用相同的设计模式和架构也让修复bug或者二次开发更容易。一套经过验证的架构可以保证我的插件不出大的问题,不论插件简单还是复杂。

阅读更多

为CKEditor添加中文字体选项

CKEditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器。它志于轻量化,不需要太复杂的安装步骤即可使用。它可和PHP、JavaScript、ASP、ASP.NET、ColdFusion、Java以及ABAP等不同的编程语言相结合。

CKEditor编辑器界面中的字体选项里暂时没有中文字体。可按如下方法添加:

打开CKEditor目录里的config.js,找到下面这段代码:

阅读更多

2011年使用率增长最快的十大Web技术

W3techs网站评出了2011年十大使用增速最快的Web技术,本文对其进行编译供各位参考。注意,该评选结果是在针对前100万流行网站(根据Alexa值统计)进行调查统计出的。

以下是2011年前100万流行网站中使用率增长最多的10大Web技术。

1. jQuery

jQuery在前100万流行网站选择中新增了惊人的145 300个名额。也就是,在过去的一年中,每天都有398个网站开始使用它。jQuery目前在所有网站中的使用率已达到了42.8%。其市占率更是达到了 84.1%,许多人都将它视为JavaScript库的事实标准。

2. UTF-8

UTF-8在去年的榜单中居于榜首地位,而且也正变得越来越流行。去年有82 6000个新增网站选择使用它。目前已有超过2/3的网站将字符编码切换为UTF-8。

阅读更多

消息称微软将于3月24日发布IE9正式版

Internet Explorer

  北京时间3月2日晚间消息,据知情人士透露,微软可能会在印度班加罗尔举行的Tech.Ed科技大会上发布IE9浏览器最终版本。

  Tech.Ed科技大会将于3月23日至25日举行。在微软MSDN印度公司出现失误,在Tweet上泄露了IE9浏览器上市的消息后,有关这款产品的传闻便开始甚嚣尘上。微软MSDN印度在其官方Twitter账户上发布消息称:“IE9将在3月24日举行的TechEd大会上正式发布。”但随后不久,这则消息从微软MSDN印度的Twitter上被删除。

  消息人士透露,微软Internet Explorer 和Windows Live业务集团总经理布莱恩·霍尔(Brian Hall)将于3月24日在Tech.Ed科技大会上发表主旨演讲,届时,他可能会宣布IE9正式推出的消息。2011年2月初,微软CEO史蒂夫·鲍尔默(Steve Ballmer)曾表示,IE9有望在3月面世。微软在2月10日推出了IE9最终预览版。

  相对于以前版本,IE9最大的变化就是支持多个CSS 3标准,JavaScript性能得到提升,新的WIC解码器还能读取图像中嵌入的色彩配置,包括ICC v2、ICC v4等。其他功能还包括跟踪保护(Tracking Protection),可让用户上网时阻止各种形式的跟踪。此外,用户还能在浏览网页时利用“ActiveX过滤器”关闭ActiveX,以防止被ActiveX控制。IE9还支持新的Chakra脚本引擎以此提高硬件运行速度。

  该版本增加了HTML5视频音频功能,支持Web Open Font Format (WOFF)标准的内嵌字体,同时提供32位和64位两个版本。微软IE浏览器是当前世界使用最广泛的浏览器,但近年来,谷歌Chrome、Mozilla火狐和Safari等浏览器成为这款产品的强劲对手。微软希望通过发布IE9浏览器,重新夺回失去的市场份额。

阅读更多

分享一个用jQuery实现自动检测并设置浏览器编码的实例

最近在一个项目遇到了需要全部适用UTF-8编码来制作页面的问题,发现有时浏览器并不那么听话,于是写了一段自动检测并且设置浏览器编码的程序,非常简单,具体方法如下:

下面html页面:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="JavaScript" type="text/javascript" src="jquery.js"></script>
<script language="JavaScript" type="text/javascript" src="autocharset.js"></script>
</head>

<body>
<p>这是一个自动检测并设置浏览器编码的实例</p>
</body>
</html>

下面是autocharset.js文件:

$(document).ready(function() {
    if($(document).attr("charset") == "utf-8") {
        alert($(document).attr("charset")); //debug
    } else {
        $(document).attr("charset", "utf-8");
        window.location.reload();
    }
});

弹出的模式窗体控制父窗体的方法

在父窗体中弹出一个模式窗体:

var strUrl = ‘test.php’;
window.showModalDialog(strUrl, window, “dialogWidth:800px; dialogHeight:600px; dialogHide:yes; scroll:no; status:no”);

在模式窗体中获取父窗体对象,并控制父窗体页面进行刷新(也可以进行其他操作)。

var objParentWin = window.dialogArguments; //获取父窗体对象
objParentWin.location.reload(); //刷新父窗体