Ajax Web - Fdream's Blog

2009-3

Fdream 发表于 Ajax Web，已被阅读 3105 次，评论 1 条
关键词：mootools javascript ajax 教程

先废话几句，这第23篇教程一直没有翻译出来，直到今天我看到待审评论里面有这么一条超长的评论，结果一看，居然是这篇教程的翻译稿。这位热心的Mootools爱好者是Fanhp，非常感谢你的辛勤劳动！同时，我感到非常羞愧，实在是有愧大家的期望！愧疚是要拿行动来补的，于是我赶紧对此篇翻译进行了一些整理，修改了其中部分词句，并整理了示例代码。

------------------------

如果你还没有准备好开始这一讲，请参考这一系列的教程，这里是《MooTools 1.2系列教程目录》。

今天继续我们的Mootools 1.2教程的第23课，我们今天来讲一下Fx插件中的Fx.Slide。通过该插件，可以让你把内容以滑动的方式显示出来。它使用起来非常简单，是你UI工具箱中一个很好的工具。

基本用法

就像我们前面看过的所有类一样，我们在把这个类应用到一个元素上面时，我们要做的第一件事就是初始化一个新的Fx.Slide实例。

首先，让我们为滑动元素建立一个HTML文件。

参考代码： [复制代码] [保存代码]

<div id="slide_element" class="slide">这里是要滑动显示的内容。</div>

继续阅读全文

Mootools常用方法扩展（五）

2009-3

Fdream 发表于 Ajax Web，已被阅读 977 次，评论 0 条
关键词：mootools javascript ajax

继续Mootools的扩展，适用于Mootools 1.1及1.2，这次在Element扩展了两个非常简单的方法，一个用来获取或者设置一个元素的innerHTML（这个是模仿jQuery里面的html()方法），还一个方法是把一个表单对象转成hash对象，用得比较少一点。

方法：html

说明：当参数不为空时，设置一个元素的innerHTML，当参数为空时，返回当前元素的innerHTML。

参考代码： [复制代码] [保存代码]

Element.implement({
    html: function(s) {
        ///<summary>
        /// 获取元素的HTML内容或者设置元素的HTML内容
        ///</summary>
        ///<param name="s" type="String">参数为空时，获取HTML内容；参数为字符串时，设置HTML的内容</param>
        ///<returns type="String" />
        if (s === undefined) {
            return this.get('html');
        }
        else {
            this.set('html', s + '');
            return s;
        }
    }
});

继续阅读全文

掀起抛弃IE6的高潮吧

2009-2

Fdream 发表于 Ajax Web，已被阅读 861 次，评论 2 条
关键词：ie 浏览器

本来想等到IE8正式发布时再在blog中写段代码，用来提示IE6用户升级到IE8的，不过貌似IE 8已经RTM了，今天又正好看到这个“升级IE6”的活动网站，于是毫不犹豫地就加入了。不过那几个同学写的js代码有问题……代码里面居然有“document.body.appendChild”，在某些情况下会引起极不稳定的IE6crash的……还有超长的字符串相加，也够可怕的……还有……总之呢，这个代码写的非常的不负责任！那几个挂名的tencent的兄弟也稍微用点功嘛，不要只挂名不做事！我自己稍微改了下代码，如果明天有空就发出来给大家共享吧！

不过那个网站写的更新IE6的理由只是从开发者角度讲的，没有告诉用户为什么要去升级IE6，不是很好。

为达到呈现效果达到一致性，新版本浏览器迫不得已向旧版本对齐，从而抑制了正常的发展。
已升级的语言在IE6无法解析以致其用户体验不了升级后的成果。
在开发当中不断地为IE6做出兼容性处理，无疑增加了开发者的工作量，增加了开发成本。
考虑到使用旧式浏览器的用户，开发者不敢作新语言的尝试因此拖慢了W3C标准的步伐。

放弃IE6吧：“Internet Explorer 6 sp1发布距离至今已经有7年时间了相对于人类70年的寿命，对新版本语言支持已经显得力不从心了。”

继续阅读全文

在IE8中继续使用滤镜及IE8的一些CSS扩展属性

2009-2

Fdream 发表于 Ajax Web，已被阅读 806 次，评论 0 条
关键词：ie css

很早以前就说过，IE8的标准模式已经不再支持滤镜了，不过IE仍然留了一条后路，你可以在CSS中这样写滤镜：

参考代码： [复制代码] [保存代码]

-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)";

当非常遗憾的是，这个属性只有IE8能认识，如果要兼容IE6还有IE7，你必须在这一行的后面继续加上以前的滤镜代码：

参考代码： [复制代码] [保存代码]

-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)";
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);

注意：这个先后顺序非常重要！这会影响到IE8兼容模式下的显示效果。

官方blog（IE Blog）的关于在IE8中使用滤镜原文在这里...

继续阅读全文

Mootools常用方法扩展（四）

2009-2

Fdream 发表于 Ajax Web，已被阅读 640 次，评论 0 条
关键词：mootools javascript ajax

继续Mootools常用方法扩展，这次是Window类上的扩展，也就是全局函数。

方法：$params

说明：获取页面URL参数。你可以使用任何指定的分隔符，比如'#'，默认为'#'。

参考代码： [复制代码] [保存代码]

Window.implement({
    $params: function(delimiter) {
        ///<summary>
        /// 获取页面URL的参数，返回包含参数的hash对象
        ///</summary>
        ///<param name="delimiter" type="String">参数和URL的分隔符，比如?或者#，默认为#</param>
        ///<returns type="Hash" />
        delimiter = (delimiter || '#').escapeRegExp();
        var params = new Hash();
        try {
            var requestStr = (location.toString().match(new RegExp(delimiter + '(.+)$')) || [0, 0])[1];
            if (requestStr) {
                params = requestStr.toHash(true);
            }
        }
        catch (e) {
        }
        return params;
    }
}

方法：$dump

说明：类似于PHP中的var_dump方法，打印指定的变量或者对象的内容，返回描述变量内容的字符串...

继续阅读全文

JavaScript奇怪的比较——隐式类型转换

2009-2

Fdream 发表于 Ajax Web，已被阅读 645 次，评论 0 条
关键词：javascript ajax

我们先看一下JavaScript中关系运算符的类型转换规则：

引用内容：

关系运算符（<、>、<=、>=）

试图将 expression1 和 expression2 都转换为数字。
如果两表达式均为字符串，则按字典序进行字符串比较。
如果其中一个表达式为 NaN，返回 false。
负零等于正零。
负无穷小于包括其本身在内的任何数。
正无穷大于包括其本身在内的任何数。

所以很容易理解下面这样的比较：

参考代码： [复制代码] [保存代码]

1 < NaN: false
1 >= NaN: false

'a' < 1: false
'a' >= 1: false

继续阅读全文

jQuery方法扩展：type, toJSON, evalJSON

2009-2

Fdream 发表于 Ajax Web，已被阅读 1762 次，评论 0 条
关键词：jQuery javascript ajax

jQuery居然都没有JSON的decode和encode，精确类型判断也没有，囧……自己动手写吧！不过这些东西在网上都已经有很好的版本了，自己也不用太费脑筋，拿来用吧！类型判断在这里有一段很好的代码：http://lucassmith.name/pub/typeof.html，JSON的decode和encode就直接用Mootools的吧！（不过Mootools里面的JSON.encode方法还不够完美，我作了一些完善。）

参考代码： [复制代码] [保存代码]

/**
* extension of JSON, type for jQuery
* AUTHOR: xushengs@gmail.com
* LICENSE: http://www.opensource.org/licenses/mit-license.php
* WEBSITE: http://ooboy.net/
*/
(function($) {
    // the code of this function is from
    // http://lucassmith.name/pub/typeof.html
    $.type = function(o) {
        var _toS = Object.prototype.toString;
        var _types = {
            'undefined': 'undefined',
            'number': 'number',
            'boolean': 'boolean',
            'string': 'string',
            '[object Function]': 'function',
            '[object RegExp]': 'regexp',
            '[object Array]': 'array',
            '[object Date]': 'date',
            '[object Error]': 'error'
        };

        return _types[typeof o] || _types[_toS.call(o)] || (o ? 'object' : 'null');
    };
    // 剩下的代码请进入全文查看
})(jQuery);

继续阅读全文

【更新】jQuery 1.3.1的VS智能提示下载

2009-2

Fdream 发表于 Ajax Web，已被阅读 1154 次，评论 0 条
关键词：jquery javascript ajax

谢谢yzty的提醒，jQuery官方说是修改了一些bug，diff了一下代码，发现主要是selector里面的，主要是逻辑上的变化，接口没有任何变化，赶紧从1.3更新到1.3.1吧！

点击这里可以下载可以在Visual Studio 2008中显示智能提示的jQuery版本（jquery 1.3.1）。（发现jquery官方提供的1.3.1的vsdoc貌似是1.2.6的，有几个方法的参数都和1.3.1都不一样，还有部分代码不一样，囧……）