<-- IE錯誤修正 --> prototype.js源码解读(一) - RiS社群 | FileMaker 中小企業應用



快速發表主題
返回   RiS社群 | FileMaker 中小企業應用 > PHP / ASP.NET / HTML5 / jQuery > HTML5 = TAG + CSS3 + JavaScript APIs > jQuery 討論區 (jQuery 豐富資源)

jQuery 討論區 (jQuery 豐富資源) 包含 jQuery 有關學習、教學、Frameworks 使用、程式與應用範例等,將集中於此。


FileMaker 教學 FileMaker 14 教學課程 FileMaker 教學
FileMaker 課程(僅接受公司/單位或1對1專屬教學

輕鬆學會FileMaker
帶你認識FileMaker

FileMaker俱樂部 加入FileMaker獲取官方資訊 FileMaker俱樂部
FileMaker俱樂部

回覆
 
LinkBack 主題工具 顯示模式
  #1 (permalink)  
舊 2007-11-01
初級會員
 
註冊日期: 2007-11-01
文章: 3
預設 prototype.js源码解读(一)

我喜欢Javascript,热衷于 Ajax 应用。我把自己阅读prototype源码的体会写下来,希望对大家重新认识 Javascript 有所帮助。

代码:

/**
* 定义一个全局对象, 属性 Version 在发布的时候会替换为当前版本号
*/
var Prototype = {
Version: '@@VERSION@@'
}

/**
* 创建一种类型,注意其属性 create 是一个方法,返回一个构造函数。
* 一般使用如下
* var X = Class.create(); 返回一个类型,类似于 java 的一个Class实例。
* 要使用 X 类型,需继续用 new X()来获取一个实例,如同 java 的 Class.newInstance()方法。
*
* 返回的构造函数会执行名为 initialize 的方法, initialize 是 Ruby 对象的构造器方法名字。
* 此时initialize方法还没有定义,其后的代码中创建新类型时会建立相应的同名方法。
*
* 如果一定要从java上去理解。你可以理解为用Class.create()创建一个继承java.lang.Class类的类。当然java不允许这样做,因为Class类是final的
*
*/
var Class = {
create: function() {
return function() {
this.initialize.apply(this, arguments);
}
}
}

/**
* 创建一个对象,从变量名来思考,本意也许是定义一个抽象类,以后创建新对象都 extend 它。
* 但从其后代码的应用来看, Abstract 更多是为了保持命名空间清晰的考虑。
* 也就是说,我们可以给 Abstract 这个对象实例添加新的对象定义。
*
* 从java去理解,就是动态给一个对象创建内部类。
*/
var Abstract = new Object();

/**
* 获取参数对象的所有属性和方法,有点象多重继承。但是这种继承是动态获得的。
* 如:
* var a = new ObjectA(), b = new ObjectB();
* var c = a.extend(b);
* 此时 c 对象同时拥有 a 和 b 对象的属性和方法。但是与多重继承不同的是,c instanceof ObjectB 将返回false。
*/
Object.prototype.extend = function(object) {
for (property in object) {
this[property] = object[property];
}
return this;
}

/**
* 这个方法很有趣,它封装一个javascript函数对象,返回一个新函数对象,新函数对象的主体和原对象相同,但是bind()方法参数将被用作当前对象的对象。
* 也就是说新函数中的 this 引用被改变为参数提供的对象。
* 比如:
* <input type="text" id="aaa" value="aaa">
* <input type="text" id="bbb" value="bbb">
* .................
* <script>
* var aaa = document.getElementById("aaa");
* var bbb = document.getElementById("bbb");
* aaa.showValue = function() {alert(this.value);}
* aaa.showValue2 = aaa.showValue.bind(bbb);
* </script>
* 那么,调用aaa.showValue 将返回"aaa", 但调用aaa.showValue2 将返回"bbb"。
*
* apply 是ie5.5后才出现的新方法(Netscape好像很早就支持了)。
* 该方法更多的资料参考MSDN http://msdn.microsoft.com/library/en...jsmthApply.asp
* 还有一个 call 方法,应用起来和 apply 类似。可以一起研究下。
*/
Function.prototype.bind = function(object) {
var method = this;
return function() {
method.apply(object, arguments);
}
}

/**
* 和bind一样,不过这个方法一般用做html控件对象的事件处理。所以要传递event对象
* 注意这时候,用到了 Function.call。它与 Function.apply 的不同好像仅仅是对参数形式的定义。
* 如同 java 两个过载的方法。
*/
Function.prototype.bindAsEventListener = function(object) {
var method = this;
return function(event) {
method.call(object, event || window.event);
}
}

/**
* 将整数形式RGB颜色值转换为HEX形式
*/
Number.prototype.toColorPart = function() {
var digits = this.toString(16);
if (this < 16) return '0' + digits;
return digits;
}

/**
* 典型 Ruby 风格的函数,将参数中的方法逐个调用,返回第一个成功执行的方法的返回值
*/
var Try = {
these: function() {
var returnValue;

for (var i = 0; i < arguments.length; i++) {
var lambda = arguments[i];
try {
returnValue = lambda();
break;
} catch (e) {}
}

return returnValue;
}
}

/*--------------------------------------------------------------------------*/

/**
* 一个设计精巧的定时执行器
* 首先由 Class.create() 创建一个 PeriodicalExecuter 类型,
* 然后用对象直接量的语法形式设置原型。
*
* 需要特别说明的是 rgisterCallback 方法,它调用上面定义的函数原型方法bind, 并传递自己为参数。
* 之所以这样做,是因为 setTimeout 默认总以 window 对象为当前对象,也就是说,如果 registerCallback 方法定义如下的话:
* registerCallback: function() {
* setTimeout(this.onTimerEvent, this.frequency * 1000);
* }
* 那么,this.onTimeoutEvent 方法执行失败,因为它无法访问 this.currentlyExecuting 属性。
* 而使用了bind以后,该方法才能正确的找到this,也就是PeriodicalExecuter的当前实例。
*/
var PeriodicalExecuter = Class.create();
PeriodicalExecuter.prototype = {
initialize: function(callback, frequency) {
this.callback = callback;
this.frequency = frequency;
this.currentlyExecuting = false;

this.registerCallback();
},

registerCallback: function() {
setTimeout(this.onTimerEvent.bind(this), this.frequency * 1000);
},

onTimerEvent: function() {
if (!this.currentlyExecuting) {
try {
this.currentlyExecuting = true;
this.callback();
} finally {
this.currentlyExecuting = false;
}
}

this.registerCallback();
}
}

/*--------------------------------------------------------------------------*/

/**
* 这个函数就 Ruby 了。我觉得它的作用主要有两个
* 1. 大概是 document.getElementById(id) 的最简化调用。
* 比如:$("aaa") 将返回上 aaa 对象
* 2. 得到对象数组
* 比如: $("aaa","bbb") 返回一个包括id为"aaa"和"bbb"两个input控件对象的数组。
*/
function $() {
var elements = new Array();

for (var i = 0; i < arguments.length; i++) {
var element = arguments[i];
if (typeof element == 'string')
element = document.getElementById(element);

if (arguments.length == 1)
return element;

elements.push(element);
}

return elements;
}
/**
* 定义 Ajax 对象, 静态方法 getTransport 方法返回一个 XMLHttp 对象
*/
var Ajax = {
getTransport: function() {
return Try.these(
function() {return new ActiveXObject('Msxml2.XMLHTTP')},
function() {return new ActiveXObject('Microsoft.XMLHTTP')},
function() {return new XMLHttpRequest()}
) || false;
},

emptyFunction: function() {}
}

/**
* 我以为此时的Ajax对象起到命名空间的作用。
* Ajax.Base 声明为一个基础对象类型
* 注意 Ajax.Base 并没有使用 Class.create() 的方式来创建,我想是因为作者并不希望 Ajax.Base 被库使用者实例化。
* 作者在其他对象类型的声明中,将会继承于它。
* 就好像 java 中的私有抽象类
*/
Ajax.Base = function() {};
Ajax.Base.prototype = {
/**
* extend (见prototype.js中的定义) 的用法真是让人耳目一新
* options 首先设置默认属性,然后再 extend 参数对象,那么参数对象中也有同名的属性,那么就覆盖默认属性值。
* 想想如果我写这样的实现,应该类似如下:
setOptions: function(options) {
this.options.methed = options.methed? options.methed : 'post';
..........
}
我想很多时候,java 限制了 js 的创意。
*/
setOptions: function(options) {
this.options = {
method: 'post',
asynchronous: true,
parameters: ''
}.extend(options || {});
}
}


/**
* Ajax.Request 封装 XmlHttp
*/
Ajax.Request = Class.create();

/**
* 定义四种事件(状态), 参考http://msdn.microsoft.com/workshop/a...adystate_1.asp
*/
Ajax.Request.Events =
['Uninitialized', 'Loading', 'Loaded', 'Interactive', 'Complete'];

/**
*
*/
Ajax.Request.prototype = (new Ajax.Base()).extend({
initialize: function(url, options) {
this.transport = Ajax.getTransport();
this.setOptions(options);

try {
if (this.options.method == 'get')
url += '?' + this.options.parameters + '&_=';

/**
* 此处好像强制使用了异步方式,而不是依照 this.options.asynchronous 的值
*/
this.transport.open(this.options.method, url, true);

/**
* 这里提供了 XmlHttp 传输过程中每个步骤的回调函数
*/
if (this.options.asynchronous) {
this.transport.onreadystatechange = this.onStateChange.bind(this);
setTimeout((function() {this.respondToReadyState(1)}).bind(this), 10);
}

this.transport.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
this.transport.setRequestHeader('X-Prototype-Version', Prototype.Version);

if (this.options.method == 'post') {
this.transport.setRequestHeader('Connection', 'close');
this.transport.setRequestHeader('Content-type',
'application/x-www-form-urlencoded');
}

this.transport.send(this.options.method == 'post' ?
this.options.parameters + '&_=' : null);

} catch (e) {
}
},

onStateChange: function() {
var readyState = this.transport.readyState;
/**
* 如果不是 Loading 状态,就调用回调函数
*/
if (readyState != 1)
this.respondToReadyState(this.transport.readyState);
},

/**
* 回调函数定义在 this.options 属性中,比如:
var option = {
onLoaded : function(req) {...};
......
}
new Ajax.Request(url, option);
*/
respondToReadyState: function(readyState) {
var event = Ajax.Request.Events[readyState];
(this.options['on' + event] || Ajax.emptyFunction)(this.transport);
}
});

/**
* Ajax.Updater 用于绑定一个html元素与 XmlHttp调用的返回值。类似与 buffalo 的 bind。
* 如果 options 中有 insertion(from dom.js) 对象的话, insertion 能提供更多的插入控制。
*/
Ajax.Updater = Class.create();
Ajax.Updater.prototype = (new Ajax.Base()).extend({
initialize: function(container, url, options) {
this.container = $(container);
this.setOptions(options);

if (this.options.asynchronous) {
this.onComplete = this.options.onComplete;
this.options.onComplete = this.updateContent.bind(this);
}

this.request = new Ajax.Request(url, this.options);

if (!this.options.asynchronous)
this.updateContent();
},

updateContent: function() {
if (this.options.insertion) {
new this.options.insertion(this.container,
this.request.transport.responseText);
} else {
this.container.innerHTML = this.request.transport.responseText;
}

if (this.onComplete) {
setTimeout((function() {this.onComplete(this.request)}).bind(this), 10);
}
}
});
/**
* 针对 页面元素对象 的工具类,提供一些简单静态方法
*/
var Field = {
/**
* 清除参数引用对象的值
*/
clear: function() {
for (var i = 0; i < arguments.length; i++)
$(arguments[i]).value = '';
},

/**
* 使参数引用对象获取焦点
*/
focus: function(element) {
$(element).focus();
},

/**
* 判断参数引用对象值是否为空,如为空,返回false, 反之true
*/
present: function() {
for (var i = 0; i < arguments.length; i++)
if ($(arguments[i]).value == '') return false;
return true;
},

/**
* 使选中参数引用对象
*/
select: function(element) {
$(element).select();
},

/**
* 使参数引用对象处于可编辑状态
*/
activate: function(element) {
$(element).focus();
$(element).select();
}
}

/*--------------------------------------------------------------------------*/

/**
* 表单工具类
*/
var Form = {
/**
* 将表单元素序列化后的值组合成 QueryString 的形式
*/
serialize: function(form) {
var elements = Form.getElements($(form));
var queryComponents = new Array();

for (var i = 0; i < elements.length; i++) {
var queryComponent = Form.Element.serialize(elements[i]);
if (queryComponent)
queryComponents.push(queryComponent);
}

return queryComponents.join('&');
},

/**
* 得到表单的所有元素对象
*/
getElements: function(form) {
form = $(form);
var elements = new Array();

for (tagName in Form.Element.Serializers) {
var tagElements = form.getElementsByTagName(tagName);
for (var j = 0; j < tagElements.length; j++)
elements.push(tagElements[j]);
}
return elements;
},

/**
* 将指定表单的元素置于不可用状态
*/
disable: function(form) {
var elements = Form.getElements(form);
for (var i = 0; i < elements.length; i++) {
var element = elements[i];
element.blur();
element.disable = 'true';
}
},


此文章於 2007-11-01 05:01 AM 被 korpton 編輯.
回覆時引用此篇文章
  #2 (permalink)  
舊 2007-11-01
初級會員
 
註冊日期: 2007-11-01
文章: 3
預設 prototype.js源码解读(二)

/**
* 使表单的第一个非 hidden 类型而且处于可用状态的元素获得焦点
*/
focusFirstElement: function(form) {
form = $(form);
var elements = Form.getElements(form);
for (var i = 0; i < elements.length; i++) {
var element = elements[i];
if (element.type != 'hidden' && !element.disabled) {
Field.activate(element);
break;
}
}
},

/*
* 重置表单
*/
reset: function(form) {
$(form).reset();
}
}

/**
* 表单元素工具类
*/
Form.Element = {
/**
* 返回表单元素的值先序列化再进行 URL 编码后的值
*/
serialize: function(element) {
element = $(element);
var method = element.tagName.toLowerCase();
var parameter = Form.Element.Serializers[method](element);

if (parameter)
return encodeURIComponent(parameter[0]) + '=' +
encodeURIComponent(parameter[1]);
},

/**
* 返回表单元素序列化后的值
*/
getValue: function(element) {
element = $(element);
var method = element.tagName.toLowerCase();
var parameter = Form.Element.Serializers[method](element);

if (parameter)
return parameter[1];
}
}

/**
* prototype 的所谓序列化其实就是将表单的名字和值组合成一个数组
*/
Form.Element.Serializers = {
input: function(element) {
switch (element.type.toLowerCase()) {
case 'hidden':
case 'password':
case 'text':
return Form.Element.Serializers.textarea(element);
case 'checkbox':
case 'radio':
return Form.Element.Serializers.inputSelector(element);
}
return false;
},

inputSelector: function(element) {
if (element.checked)
return [element.name, element.value];
},

textarea: function(element) {
return [element.name, element.value];
},

/**
* 看样子,也不支持多选框(select-multiple)
*/
select: function(element) {
var index = element.selectedIndex;
var value = element.options[index].value || element.options[index].text;
return [element.name, (index >= 0) ? value : ''];
}
}

/*--------------------------------------------------------------------------*/

/**
* Form.Element.getValue 也许会经常用到,所以做了一个快捷引用
*/
var $F = Form.Element.getValue;

/*--------------------------------------------------------------------------*/

/**
* Abstract.TimedObserver 也没有用 Class.create() 来创建,和Ajax.Base 意图应该一样
* Abstract.TimedObserver 顾名思义,是套用Observer设计模式来跟踪指定表单元素,
* 当表单元素的值发生变化的时候,就执行回调函数
*
* 我想 Observer 与注册onchange事件相似,不同点在于 onchange 事件是在元素失去焦点的时候才激发。
* 同样的与 onpropertychange 事件也相似,不过它只关注表单元素的值的变化,而且提供timeout的控制。
*
* 除此之外,Observer 的好处大概就在与更面向对象,另外可以动态的更换回调函数,这就比注册事件要灵活一些。
* Observer 应该可以胜任动态数据校验,或者多个关联下拉选项列表的连动等等
*
*/
Abstract.TimedObserver = function() {}

/**
* 这个设计和 PeriodicalExecuter 一样,bind 方法是实现的核心
*/
Abstract.TimedObserver.prototype = {
initialize: function(element, frequency, callback) {
this.frequency = frequency;
this.element = $(element);
this.callback = callback;

this.lastValue = this.getValue();
this.registerCallback();
},

registerCallback: function() {
setTimeout(this.onTimerEvent.bind(this), this.frequency * 1000);
},

onTimerEvent: function() {
var value = this.getValue();
if (this.lastValue != value) {
this.callback(this.element, value);
this.lastValue = value;
}

this.registerCallback();
}
}

/**
* Form.Element.Observer 和 Form.Observer 其实是一样的
* 注意 Form.Observer 并不是用来跟踪整个表单的,我想大概只是为了减少书写(这是Ruby的一个设计原则)
*/
Form.Element.Observer = Class.create();
Form.Element.Observer.prototype = (new Abstract.TimedObserver()).extend({
getValue: function() {
return Form.Element.getValue(this.element);
}
});

Form.Observer = Class.create();
Form.Observer.prototype = (new Abstract.TimedObserver()).extend({
getValue: function() {
return Form.serialize(this.element);
}
});
/**
* 根据 class attribute 的名字得到对象数组,支持 multiple class
*
*/
document.getElementsByClassName = function(className) {
var children = document.getElementsByTagName('*') || document.all;
var elements = new Array();

for (var i = 0; i < children.length; i++) {
var child = children[i];
var classNames = child.className.split(' ');
for (var j = 0; j < classNames.length; j++) {
if (classNames[j] == className) {
elements.push(child);
break;
}
}
}

return elements;
}

/*--------------------------------------------------------------------------*/

/**
* Element 就象一个 java 的工具类,主要用来 隐藏/显示/销除 对象,以及获取对象的简单属性。
*
*/
var Element = {
toggle: function() {
for (var i = 0; i < arguments.length; i++) {
var element = $(arguments[i]);
element.style.display =
(element.style.display == 'none' ? '' : 'none');
}
},

hide: function() {
for (var i = 0; i < arguments.length; i++) {
var element = $(arguments[i]);
element.style.display = 'none';
}
},

show: function() {
for (var i = 0; i < arguments.length; i++) {
var element = $(arguments[i]);
element.style.display = '';
}
},

remove: function(element) {
element = $(element);
element.parentNode.removeChild(element);
},

getHeight: function(element) {
element = $(element);
return element.offsetHeight;
}
}

/**
* 为 Element.toggle 做了一个符号连接,大概是兼容性的考虑
*/
var Toggle = new Object();
Toggle.display = Element.toggle;

/*--------------------------------------------------------------------------*/

/**
* 动态插入内容的实现,MS的Jscript实现中对象有一个 insertAdjacentHTML 方法(http: //msdn.microsoft.com/workshop/author/dhtml/reference/methods/insertadjacenthtml.asp)
* 这里算是一个对象形式的封装。
*/
Abstract.Insertion = function(adjacency) {
this.adjacency = adjacency;
}

Abstract.Insertion.prototype = {
initialize: function(element, content) {
this.element = $(element);
this.content = content;

if (this.adjacency && this.element.insertAdjacentHTML) {
this.element.insertAdjacentHTML(this.adjacency, this.content);
} else {
/**
* gecko 不支持 insertAdjacentHTML 方法,但可以用如下代码代替
*/
this.range = this.element.ownerDocument.createRange();
/**
* 如果定义了 initializeRange 方法,则实行,这里相当与定义了一个抽象的 initializeRange 方法
*/
if (this.initializeRange) this.initializeRange();
this.fragment = this.range.createContextualFragment(this.content);

/**
* insertContent 也是一个抽象方法,子类必须实现
*/
this.insertContent();
}
}
}

/**
* prototype 加深了我的体会,就是写js 如何去遵循 Don’t Repeat Yourself (DRY) 原则
* 上文中 Abstract.Insertion 算是一个抽象类,定义了名为 initializeRange 的一个抽象方法
* var Insertion = new Object() 建立一个命名空间
* Insertion.Before|Top|Bottom|After 就象是四个java中的四个静态内部类,而它们分别继承于Abstract.Insertion,并实现了initializeRange方法。
*/
var Insertion = new Object();

Insertion.Before = Class.create();
Insertion.Before.prototype = (new Abstract.Insertion('beforeBegin')).extend({
initializeRange: function() {
this.range.setStartBefore(this.element);
},

/**
* 将内容插入到指定节点的前面, 与指定节点同级
*/
insertContent: function() {
this.element.parentNode.insertBefore(this.fragment, this.element);
}
});

Insertion.Top = Class.create();
Insertion.Top.prototype = (new Abstract.Insertion('afterBegin')).extend({
initializeRange: function() {
this.range.selectNodeContents(this.element);
this.range.collapse(true);
},

/**
* 将内容插入到指定节点的第一个子节点前,于是内容变为该节点的第一个子节点
*/
insertContent: function() {
this.element.insertBefore(this.fragment, this.element.firstChild);
}
});

Insertion.Bottom = Class.create();
Insertion.Bottom.prototype = (new Abstract.Insertion('beforeEnd')).extend({
initializeRange: function() {
this.range.selectNodeContents(this.element);
this.range.collapse(this.element);
},

/**
* 将内容插入到指定节点的最后,于是内容变为该节点的最后一个子节点
*/
insertContent: function() {
this.element.appendChild(this.fragment);
}
});


Insertion.After = Class.create();
Insertion.After.prototype = (new Abstract.Insertion('afterEnd')).extend({
initializeRange: function() {
this.range.setStartAfter(this.element);
},

/**
* 将内容插入到指定节点的后面, 与指定节点同级
*/
insertContent: function() {
this.element.parentNode.insertBefore(this.fragment,
this.element.nextSibling);
}
});

回覆時引用此篇文章
  #3 (permalink)  
舊 2007-11-01
初級會員
 
註冊日期: 2007-11-01
文章: 3
預設 prototype.js源码解读(三)

/* 这是包含错误的原版本
if (!Function.prototype.apply) {
// Based on code from http://www.youngpup.net/
Function.prototype.apply = function(object, parameters) {
var parameterStrings = new Array();
if (!object) object = window;
if (!parameters) parameters = new Array();

for (var i = 0; i < parameters.length; i++)
parameterStrings[i] = 'x[' + i + ']'; //Error 1

object.__apply__ = this;
var result = eval('obj.__apply__(' + //Error 2
parameterStrings[i].join(', ') + ')');
object.__apply__ = null;

return result;
}
}
*/

if (!Function.prototype.apply) {
Function.prototype.apply = function(object, parameters) {
var parameterStrings = new Array();
if (!object) object = window;
if (!parameters) parameters = new Array();

for (var i = 0; i < parameters.length; i++)
parameterStrings[i] = 'parameters[' + i + ']';

object.__apply__ = this;
var result = eval('object.__apply__(' + parameterStrings.join(', ') + ')');
object.__apply__ = null;

return result;
}
}
/* 这是包含错误的原版本
if (!Function.prototype.apply) {
// Based on code from http://www.youngpup.net/
Function.prototype.apply = function(object, parameters) {
var parameterStrings = new Array();
if (!object) object = window;
if (!parameters) parameters = new Array();

for (var i = 0; i < parameters.length; i++)
parameterStrings[i] = 'x[' + i + ']'; //Error 1

object.__apply__ = this;
var result = eval('obj.__apply__(' + //Error 2
parameterStrings[i].join(', ') + ')');
object.__apply__ = null;

return result;
}
}
*/

if (!Function.prototype.apply) {
Function.prototype.apply = function(object, parameters) {
var parameterStrings = new Array();
if (!object) object = window;
if (!parameters) parameters = new Array();

for (var i = 0; i < parameters.length; i++)
parameterStrings[i] = 'parameters[' + i + ']';

object.__apply__ = this;
var result = eval('object.__apply__(' + parameterStrings.join(', ') + ')');
object.__apply__ = null;

return result;
}
}


接下来是我模仿着编写的一个 Effect 的一个子类,用来实现闪烁的效果。

代码:

Effect.Blink = Class.create();
Effect.Blink.prototype = {
initialize: function(element, frequency) {
this.element = $(element);
this.frequency = frequency?frequency:1000;
this.element.effect_blink = this;
this.blink();
},

blink: function() {
if (this.timer) clearTimeout(this.timer);
try {
this.element.style.visibility = this.element.style.visibility == 'hidden'?'visible':'hidden';
} catch (e) {}
this.timer = setTimeout(this.blink.bind(this), this.frequency);
}
};

回复

回覆時引用此篇文章
  #4 (permalink)  
舊 2007-11-01
Bing 的頭像
論壇管理員
 
註冊日期: 2007-08-21
住址: 台北, 桃園, 台中(豐原區)
文章: 5,364
微笑

Very good !

回覆時引用此篇文章
  #5 (permalink)  
舊 2008-09-18
Bing 的頭像
論壇管理員
 
註冊日期: 2007-08-21
住址: 台北, 桃園, 台中(豐原區)
文章: 5,364
呲牙 JavaScript的3D旋轉木馬效果

Click the image to open in full size.


說明:
1.使用mootools.js frameworks.
2.配合PHP Easy Reflections v3

Demo:http://www.piksite.com/carousel.us/carousel.us.php
Source code 下載:http://piksite.com/Goodies/carousel.us.zip
原始站台:http://www.piksite.com/carousel.us/

回覆時引用此篇文章
  #6 (permalink)  
舊 2008-09-19
小正正 的頭像
普通會員
 
註冊日期: 2007-10-15
住址: 台北市
文章: 62
預設 回覆: JavaScript的3D旋轉木馬效果

頗有趣~ 用 Flash 來做應該還是會流暢一點。不過也不失為另一種解決方案!

__________________
比 Facebook、無名小站還好用的網站出現啦!就是有明大戰!
http://www.iyoume.net
Click the image to open in full size.
回覆時引用此篇文章
  #7 (permalink)  
舊 2009-02-17
Bing 的頭像
論壇管理員
 
註冊日期: 2007-08-21
住址: 台北, 桃園, 台中(豐原區)
文章: 5,364
燈泡 效能比一比:MooTools vs JQuery vs Prototype vs YUI vs Dojo

Click the image to open in full size.

Click the image to open in full size.


參考來源:
http://blog.creonfx.com/javascript/m...vised#comments

and this one
http://blog.creonfx.com/javascript/d...nce-comparison

回覆時引用此篇文章
  #8 (permalink)  
舊 2009-02-27
Bing 的頭像
論壇管理員
 
註冊日期: 2007-08-21
住址: 台北, 桃園, 台中(豐原區)
文章: 5,364
微笑 超過124種不同Ajax framework整理列表

Ajax許多網頁設計人員近年來很常使用,有多少Ajax framework可以用呢?下列就己列124種,甚至還有更多,到底哪些適合你用,可以參考如下,此篇就讓我偷懶一下,不做中文補充了。

來源在這:
http://ntt.cc/2008/02/13/the-most-co...ries-list.html

也可以參考這裡:
http://technotarget.com/ajax-dhtml-a...ipt-libraries/



1. dojo
“dojo” is a Japanese term which literally means “place of the Way”.Here,dojo is an Open Source DHTML toolkit written in JavaScript. It builds on several contributed code bases.Dojo aims to solve some long-standing historical problems with DHTML which prevented mass adoption of dynamic web application development.You can use the lower-level APIs and compatibility layers from Dojo to write portable JavaScript and simplify complex scripts. Dojo’s event system, I/O APIs, and generic language enhancement form the basis of a powerful programming environment.It makes professional web development better, easier, and faster.

2.Rico
Rico is an open source JavaScript framework used to create and extend Ajax-based web applications. It includes drag-and-drop functionality, and can programmatically round HTML elements.Rico provides a very simple interface for registering Ajax request handlers as well as HTML elements or JavaScript objects as Ajax response objects. Multiple elements and/or objects may be updated as the result of one Ajax request.
Rico is released under the Apache License, and is based on the Prototype Javascript Framework.

.qooxdoo
qooxdoo is a comprehensive and innovative Ajax application framework.It includes a platform-independent development tool chain, a state-of-the-art GUI toolkit and an advanced client-server communication layer.It helps you to implement professional AJAX-enhanced web 2.0 applications.
qooxdoo is under an LGPL/EPL dual license.

4.tibet
Maybe TIBET is the oldest AJAX project.It seems stop but we can find the TIBET team’s new vision (here) for Client/SOA using AJAX, JSON, and the virtual machine you call a web browser has been the driving force behind TIBET.


5.Flash/JavaScript Integration kit
The Flash JavaScript Integration Kit allows developers to get the best of the Flash and HTML worlds by enabling JavaScript to invoke ActionScript functions, and vice versa. All major data types(objects,arrays,strings,numbers,dates,booleans,nulls,undefined) can be passed between the two environments.The Flash JavaScript Integration Kit makes it possible to seamlessly communicate between Flash and JavaScript.Of course,it works across all major browsers and operating systems.
The Flash / JavaScript Integration kit is released under an open license (modeled after the Apache 1.1 license).


6.Google AJAXSLT
AJAXSLT is an implementation of XSL-T in JavaScript, intended for use in fat web pages, which are nowadays referred to as AJAX applications.Because XSLT uses XPath, it is also an implementation of XPath that can be used independently of XSLT. This implementation has the advantange that it makes XSLT uniformly available on more browsers than natively provide it, and that it can be extended to yet more browsers if necessary.AJAXSLT is interesting for developers who strive aggressively for cross browser compatibility of their advanced web applications.
Google AJAXSLT is released under an open license New BSD License.


7.libXmlRequest
It is a very simple wrapper around XHR.The XmlRequest library contains a two public request functions, getXml and postXml, that may be used to send synchronous and asynchronous XML Http requests from Internet Explorer and Mozilla.


8.RSLite
RSlite is an extremely lightweight implementation of remote scripting which uses cookies. It is very widely browser-compatible (Opera!) but limited to single calls and small amounts of data.


9.SACK
A simple set of code to allow you to put AJAX into your webpages with none of the fuss or overhead of other packages.It makes using AJAX simpler, and easy to implement.
SACK is released under a Modified X11 licence.


10.sarrisa
Sarissa is an ECMAScript library acting as a cross-browser wrapper for native XML APIs. It offers various XML related goodies like Document instantiation, XML loading from URLs or strings, XSLT transformations, XPath queries etc and comes especially handy for people doing what is lately known as “AJAX” development.


11.XHConn
XHConn is a small Javascript library that exposes a data object with a single method: connect.
Invoking this method creates an asynchronous XMLHTTPRequestt and then triggers the specified callback function with the server’s response.


12.CPAINT
CPAINT (Cross-Platform Asynchronous INterface Toolkit) is a multi-language toolkit that helps web developers design and implement AJAX web applications with ease and flexibility. It was originally born out of the author’s frustration and disappointment with other open-source AJAX toolkits. It is built on the same principles of AJAX, utilizing JavaScript and the XMLHTTP object on the client-side and the appropriate scripting language on the server-side to complete the full circle of data passing from client to server and back.


13.Sajax
Sajax (Simple Ajax Toolkit), is an open source tool designed to help websites using the Ajax framework (also known as XMLHttpRequest). It allows the programmer to call ASP, ColdFusion, Io, Lua, PHP, Perl, Python, or Ruby functions from their webpages via JavaScript without performing a browser refresh.


14.JSON/JSON-RPC
JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate. It is based on a subset of the JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999. JSON is a text format that is completely language independent but uses conventions that are familiar to programmers of the C-family of languages, including C, C++, C#, Java, JavaScript, Perl, Python, and many others. These properties make JSON an ideal data-interchange language.


15.Direct Web Remoting
In the simplest terms, DWR is an engine that exposes methods of server-side Java objects to JavaScript code. Effectively, with DWR, you can eliminate all of the machinery of the Ajax request-response cycle from your application code. This means your client-side code never has to deal with an XMLHttpRequest object directly, or with the server’s response. You don’t need to write object serialization code or use third-party tools to turn your objects into XML. You don’t even need to write servlet code to mediate Ajax requests into calls on your Java domain objects.


16.SWATO
Swato is an opensource framework that help you develop your webapps easier.
Features:
The server side Java library can be easily deployed in all Servlet 2.3+ compatible containers. The client side JavaScript library is base on prototype that can help you coding your JavaScript in the OO way. Using JSON to marshalling the data of your POJOs on server side. Providing a simple interface for your JavaScript code to interactive with the remote POJOs exposed to the client side. (RPC,cross domain access) Easy and flexible configuration using servlet and filter in web.xml and comes with Spring integration. Comes with several reusable component (Auto-suggest Textbox, JS Template, JS Logger, etc) that help you develop your web apps easier.


17.Java BluePrints
Java BluePrints is Sun Microsystems’ best practices for Enterprise Java development. This is Sun’s official programming model for Java 2 Platform, Enterprise Edition (J2EE) Software Development Kit (SDK). It began with Java Pet Store, the original reference application for the J2EE platform. This became the de facto source code for using Enterprise Java Beans and all the latest components of the J2EE platform.


18.Ajax.Net
Ajax.NET Professional, or Ajax.NET for short, is Michael Schwarz’s free Ajax add-on library for implementing Ajax functionality within the Microsoft .NET Framework. This was the first Ajax framework developed for ASP.NET 1.x/2.0, providing very basic Ajax capabiliti


19.Atlas
ASP.NET AJAX is a free framework for quickly creating efficient and interactive Web applications that work across all popular browsers.


20.Ruby on Rails
Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern. From the Ajax in the view, to the request and response in the controller, to the domain model wrapping the database, Rails gives you a pure-Ruby development environment. To go live, all you need to add is a database and a web server.


21.AFLAX
A JavaScript Library for Macromedia’s Flash™ Platform. AFLAX is a method through which developers may use JavaScript and Flash together to create AJAX-type applications, but with a much richer set of vector drawing controls than are available in either Internet Explorer or FireFox. Developers using this library have access to the full range of Flash features, but without ever touching the Flash IDE.


22.AjaxAC
AjaxAC is an open-source framework written in PHP, used to develop/create/generate AJAX applications. The fundamental idea behind AJAX (Asynchronous JavaScript And XML) is to use the XMLHttpRequest object to change a web page state using background HTTP sub-requests without reloading the entire page.


23.AJAXExtended
AJAXExtended is a JavaScript library that improves standard XMLHttpRequest features. The most important enhancement
Click the image to open in full size.24.Ajax.NET Professional
Ajax.NET Professional (AjaxPro) is one of the first AJAX frameworks available for Microsoft ASP.NET and is working with .NET 1.1 and 2.0.
Click the image to open in full size.25.AjaxRequest Library
AjaxRequest is a layer over the XMLHttpRequest functionality which makes the communication between Javascript and the server easier for developers.
Click the image to open in full size.26.AHAH: Asychronous HTML and HTTP
AHAH is a very simple technique for dynamically updating web pages using JavaScript. It involves using XMLHTTPRequest to retrieve (X)HTML fragments which are then inserted directly into the web page, whence they can be styled using CSS.
Click the image to open in full size.27.Bajax
Bajax its a very small and simple javascript library to use Ajax on your pages. independent of programming language. You can put dynamic content using simple commands
Click the image to open in full size.28.Code Snippets
Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world.
Click the image to open in full size.29.Cross-Browser.com
This site features X - a cross-browser DHTML javascript library, and many demos, applications, articles and documentation.
Click the image to open in full size.30.DHTML API, Drag & Drop for Images and Layers
A Cross-browser JavaScript DHTML Library which adds Drag Drop functionality and extended DHTML capabilities to layers and to any desired image, even those integrated into the text
Click the image to open in full size.31.DHTMLgoodies.com
A library of DHTML and AJAX scripts
Click the image to open in full size.32.DHTML Kitchen
DHTML Kitchen is your resource for ready-made or custom-built DHTML scripts. We also specialize in JSP, and front-end Java solutions.
Click the image to open in full size.33.dp.SyntaxHighlighter
dp.SyntaxHighlighter is a free JavaScript tool for source code syntax highlighting
Click the image to open in full size.34.Dynamic Drive
DHTML & JavaScript code library
Click the image to open in full size.35.DynAPI
DynAPI 3 is an open-sourced project initiated by Dan Steinman, created to make cross-browser Dynamic HTML a reality. The DynAPI library uses an object-oriented approach to solve problems associated with scripting for both Netscape and Internet Explorer.
Click the image to open in full size.36.Ext JS (javascript library)
an open-source JavaScript library, for building richly interactive web applications using techniques such as AJAX, DHTML and DOM scripting.
It extends the Web. World-class JavaScript, Ajax and UI Components.
Click the image to open in full size.37.Engine for Web Applications
Engine for Web Applications is an application framework for client-side development and Web applications. It provides an environment in which to develop and run JavaScript components and applications.
Click the image to open in full size.38.FACE
A way to easily bring life and interactivity to websites without having to use Flash. Completely accessible, with easy plug-and-play implementation.
Click the image to open in full size.39.JSL : JavaScript Standard Library
JSL is a single and small file ( IE4 compatible packed version: 7.77 Kb ) with some JavaScript 1.6 standard methods or functions that are not present on some browsers. Its goals is to forget work arounds for every library or script that’s included on a web page. You could just add JSL even before your scripts to add portability or more compatibility, then you don’t need to rewrite anything.
Click the image to open in full size.40.Javascript Toolbox
This site is intended to be a repository of code and reusable libraries which address common needs that many web developers encounter. The code found here is based on standards but also tries to be backwards-compatible for browsers which don’t support the standards
Click the image to open in full size.41.jQuery - New Wave Javascript
jQuery is a Javascript library that takes this motto to heart: Writing Javascript code should be fun. jQuery achieves this goal by taking common, repetitive, tasks, stripping out all the unnecessary markup, and leaving them short, smart and understandable.
Click the image to open in full size.42.JSAN - JavaScript Archive Network
JavaScript Archive Network is a comprehensive resource for Open Source JavaScript libraries and software.
Click the image to open in full size.43.JSFBGL - Javascript framebuffer graphics library
JSFBGL (i.e. Javascript framebuffer graphics library) is considered as an art/fun project. So do not take it too seriously. Since all the webV2.0/AJAX hype which is going on atm I started to think about a way to produce graphics with javascript. And this is the result. I don’t know if this is the most efficient way - but it works as a proof of concept.
Click the image to open in full size.44.Kabuki AJAX Toolkit
Kabuki AjaxTK is a client developer library, similar in style to traditional object-oriented widget libraries like E9clipse’s SWT, albeit for Javascript.
Click the image to open in full size.45.LINB(Lazy INternet and Browser)
LINB(Lazy INternet and Browser) is designed to allow developers coding in a more targetable, clearly, and efficiently way. LINB is platform-independent, language-independent, and C/S, B/S, RIA compatible.
Click the image to open in full size.46.liberty
JavaScript Basic library - iberty gives you the Basic shit to make web development with JavaScript comfortable. Click the image to open in full size.47.
Click the image to open in full size.47.MochiKit
“MochiKit makes JavaScript suck less.” MochiKit is a highly documented and well tested, suite of JavaScript libraries that] will help you get shit done, fast. We took all the good ideas we could find from our Python, Objective-C, etc. experience and adapted it to the crazy world of JavaScript.
Click the image to open in full size.48.moo.ajax
moo.ajax is a very simple ajax class, to be used with prototype.lite from moo.fx.
Click the image to open in full size.49.moo.fx
moo.fx is a superlightweight, ultratiny, megasmall javascript effects library, written with prototype.js.
Click the image to open in full size.50.overLIB
overLIB is a JavaScript library created to enhance websites with small popup information boxes (like tooltips) to help visitors around your website.
Click the image to open in full size.51.overLIB
overLIB is a JavaScript library created to enhance websites with small popup information boxes (like tooltips) to help visitors around your website.
Click the image to open in full size.52.overlibmws DHTML Popup Library
Download and Test Directory for the overlibmws DHTML Popup Library
Click the image to open in full size.53.Plex Toolkit
Open source feature-complete DHTML GUI toolkit and AJAX framework based on a Javascript/DOM implementation of Macromedia’s Flex technology. Uses the almost identical markup language to Flex embedded in ordinary HTML documents for describing the UI. Binding is done with Javascript.
Click the image to open in full size.54.PlotKit - Javascript Chart Plotting
PlotKit is a Chart and Graph Plotting Library for Javascript
Click the image to open in full size.55.Prototype
Prototype is a JavaScript framework that aims to ease development of dynamic web applications. Its development is driven heavily by the Ruby on Rails framework, but it can be used in any environment.
Click the image to open in full size.56.qForms JavaScript API
the most complete JavaScript API for interfacing forms. The qForms API has been designed to make forms easy to work with. It simplifies tasks HTML developers normally find tricky to handle
Click the image to open in full size.57.sardalya
sardalya is a cross-browser interface that aims to make dynamic HTML programming easy and fun. It is a cross-browser compatible system which is designed to work in all DOM-supporting browsers.
Click the image to open in full size.58.script.aculo.us
script.aculo.us provides you with easy-to-use, cross-browser user interface JavaScript libraries to make your web sites and web applications fly
Click the image to open in full size.59.JonDesign’s Smooth SlideShow Library
Using moo.fx and prototype.lite.js, this javascript slideshow system allows you to have a simple and smooth (cross-fading…) image slideshows and/or showcases on you website.
Click the image to open in full size.60.Spry Framework for Ajax
Adobes Spry framework for Ajax is a JavaScript library for web designers that provides functionality that allows designers to build pages that provide a richer experience for their users.
Click the image to open in full size.61.Tabtastic
This library is a simple way to implement tabs on your page using CSS, a little JS, and semantic markup which degrades gracefully on browsers with CSS unavailable or disabled.
Click the image to open in full size.62.Taconite
Taconite is a framework that simplifies the creation of Ajax enabled Web applications. It’s a very lightweight framework that automates the tedious tasks related to Ajax development, such as the creation and management of the XMLHttpRequest object and the creation of dynamic content…
Click the image to open in full size.63.Tacos
The Tacos library project provides components and ajax behaviour for the Tapestry java web application framework. Most of the functionality is based on the exceptional dojo javascript library.
Click the image to open in full size.64.The Solvent
The Solvent is a cross-browser AJAX application toolkit written in JavaScript. The Solvent is provided as modules or as an entire toolkit. The projects focus is to promote robust web applications and enable rapid web development.
Click the image to open in full size.65.ThyApi
ThyAPI is an api to allow the developement of better user interfaces for web applicaticions, Using javascript and Ajax, it allows a complete visual interface definition using CSS and encapsulates all objects data manipulateion. Build over DynApi.
Click the image to open in full size.66.TwinHelix
Portfolio of original, high-performance DHTML and JavaScript examples. Designed them all to be as small as possible (once you trim out the comments, of course) and fast — small code is my main priority when developing scripts, as users don’t want to wait half an hour for their site to load”.
Click the image to open in full size.67.TurboWidgets
TurboWidgets are JavaScript client-side controls that provide a rich user-interface experience for AJAX-style web applications. Built on top of the popular Dojo Toolkit, TurboWidgets are designed for ease-of-use and flexibility. Please see the dev-o-meter for latest developments.
Click the image to open in full size.68.UIZE JavaScript API
JavaScript Examples
Click the image to open in full size.69.High Performance JavaScript Vector Graphics Library
This JavaScript VectorGraphics library provides graphics capabilities for javascript: functions to draw circles, ellipses (ovals), oblique lines, polylines and polygons (for instance triangles, rectangles) dynamically into a webpage.
Click the image to open in full size.71.WMS Javascript Library
A Web Map Server (WMS) will return a static map image if given the required parameters in the URL. The purpose of the WMS Javascript Library wmsmap.js is to facilitate the creation of dynamics maps using freely available WMS servers…
Click the image to open in full size.72.Yahoo Design Pattern Library
Click the image to open in full size.73.Yahoo! User Interface Library
The Yahoo! User Interface (YUI) Library is a set of utilities and controls, written in JavaScript, for building richly interactive web applications using techniques such as DOM scripting, DHTML and AJAX…
Click the image to open in full size.74.Yahoo! UI Library
Click the image to open in full size.75.Zapatec AJAX Suite
Jump start your AJAX deployment by using the Zapatec suite which includes six widgets, three modules and a library. Don’t be intimidated by the Suite’s breadth, its components are built with ease of use in mind, and you can start with one or two and migrate to using the full suite as your needs and familiarity increase.
Click the image to open in full size.76.Zebda
Zebda is a general purpose javascript library built on Prototype 1.4.0.
Click the image to open in full size.77.Zephyr
Zephyr is an ajax based framework for php5 developers. you can easily develop business applications using this robust framework. this is extremely easy to learn and very simple to implement
Click the image to open in full size.78.ZK
ZK is an open-source Ajax Web framework that enables rich user interface for Web applications with no JavaScript and little programming.
Click the image to open in full size.79.Backbase
Enterprise Ajax Framework.
Click the image to open in full size.80.Mootools
a compact and modular JavaScript framework best known for its visual effects and transitions.
Click the image to open in full size.81.Clean AJAX
Clean is an open source engine for AJAX, that provides a high level interface to work with the AJAX technology.
Click the image to open in full size.82.Wt
Wt(witty) is a WebToolkit, allowing programmers to write code in C++ (without real knowledge of Ajax), generating content rich Ajax GUI. OpenSource Licence.
Click the image to open in full size.83.Echo
Echo is a web application framework that was created by the company NextApp. It originally started as a request-response web application framework that leveraged the Swing object model to improve the speed of application development. Through the use of the swing model, Echo was able to employ concepts such as components and event-driven programming that removed much of the pain of web application development.
Click the image to open in full size.84.Google Web Toolkit
Google Web Toolkit (GWT) is an open source Java software development framework that allows web developers to create Ajax applications in Java. It is licensed under the Apache License version 2.0.
GWT emphasizes reusable, efficient solutions to recurring Ajax challenges, namely asynchronous remote procedure calls, history management, bookmarking, and cross-browser portability.
Click the image to open in full size.85.ThinWire
ThinWire is an open source, Java based web application framework that utilizes Ajax techniques to give Web Applications the look and feel of traditional GUI applications.
Click the image to open in full size.86.Symfony
Symfony is a web application framework written in PHP which follows the model-view-controller (MVC) paradigm. Released under the MIT license, Symfony is free software. The symfony-project.com website launched on October 18, 2005.
Click the image to open in full size.87.Tigermouse
Tigermouse is a modern Ajax driven MVC framework for web applications development.
Click the image to open in full size.88.Xajax
xajax is an open source PHP class library implementation of AJAX that allows developers to create web-based Ajax applications using HTML, CSS, JavaScript, and PHP. Applications developed with xajax can asynchronously call server-side PHP functions and update content without reloading the page.
Click the image to open in full size.89.AjaxAnywhere
AjaxAnywhere is a simple way to enhance an existing JSP/Struts/Spring/JSF application with AJAX. It uses AJAX to refresh “zones” on a web page, therefore AjaxAnywhere doesn’t require changes to the underlying code, so while it’s more coarse than finely-tuned AJAX, it’s also easier to implement, and doesn’t bind your application to AJAX (i.e., browsers that don’t support AJAX can still work.). In contrast to other solutions, AjaxAnywhere is not component-oriented. You will not find here yet another AutoComplete component. Simply separate your web page into multiple zones, and use AjaxAnywhere to refresh only those zones that needs to be updated.
Click the image to open in full size.90. ajaxCFC
ajaxCFC is a ColdFusion framework meant to speed up ajax application development and deployment by providing developers seamless integration between JavaScript and ColdFusion, and providing built-in functions to quickly adapt to any type of environment, security, and helping to overcome cross-browser compatibility problems.
ajaxCFC is designed as ColdFusion components, following the best practices of object oriented programming and design patterns. Programming with ajaxCFC involves extending components and creating your own ajax facades.
Click the image to open in full size.91.AjaxTags component of Java Web Parts
AjaxTags was originally an extended version of the Struts HTML taglib, but was made into a generic taglib (i.e., not tied to Struts) and brought under the Java Web Parts library. AjaxTags is somewhat different from most other Ajax toolkits in that it provides a declarative approach to Ajax. You configure the Ajax events you want for a given page via XML config file, including what you want to happen when a request is sent and when a response is received. This takes the form of request and response handlers. A number of rather useful handlers are provided out-of-the-box, things like updating a <div>, sending a simple XML document, transforming returned XML via XSLT, etc. All that is required to make this work on a page is to add a single tag at the end, and then one following whatever page element you want to attach an Ajax event to. Any element on a page can have an Ajax event attached to it. If this sounds interesting, it is suggested you download the binary Java Web Parts distro and play with the sample app. This includes a number of excellent examples of what AjaxTags can do.
Click the image to open in full size.92.AJS
AJS is a ultra lightweight JavaScript library. It’s only about 30 KB. AJS main force is performance - both in execution and file size. It has a lot of functionality in common with MochiKit.
Click the image to open in full size.93.Anaa
Anaa means for An Ajax API and is a simple but complete framework built around XMLHttpRequest?. Anaa does support GET and POST methods. Plain Text (including JSON) and XML file are handled.
Click the image to open in full size.94.DotNetRemoting Rich Web Client SDK for ASP.NET
Rich Web Client SDK is a platform for developing rich internet applications (including AJAX). The product is available for .NET environment and includes server side DLL and a client side script
Click the image to open in full size.95.Fleegix.js
Fleegix.js provides a lightweight, cross-browser set of JavaScript tools for building dynamic Web-app UIs.
Includes a concise but powerful events system, an industrial-strength XHR library, a simple, no-muss-no-fuss XML parser, and some handy tools for working with Web forms, as well as other basic tools you need to build an Ajaxy Web UI.
Click the image to open in full size.96.JsHttpRequest
Excellent cross-browser compatibility (e.g. works with IE 5.0 with disabled ActiveX).
Support and “transparent” work with any character encoding (including any national).
AJAX file uploads from a user browser to the server without a page reloading.
Full support of PHP debug features and coding traditions.
Multi-dimensional data structures exchange (associative arrays).
Automatic choice of the best AJAX realization (XMLHttpRequest, SCRIPT, IFRAME).
XMLHttpRequest-compatible interface is available.
The main idea of JsHttpRequest is to be simple and transparent for all programmers and habitual programming techniques.
  • PHP notices and errors (including fatal) are not break the script execution;
  • there is no need of any framework (e.g. classes) to build a server part;
  • PHP arrays are converted to JS objects and back fully transparently;
  • forget about national encodings problems (e.g. works with windows-1251 on PHP part).
Click the image to open in full size.97.JSON-RPC-JAVA
JSON-RPC-Java is a key piece of Java web application middleware that allows JavaScript DHTML web applications to call remote methods in a Java Application Server (remote scripting) without the need for page reloading (as is the case with the vast majority of current web applications). It enables a new breed of fast and highly dynamic enterprise Java web applications (using similar techniques to Gmail and Google Suggests).
Click the image to open in full size.98.Rialto
Rialto is a cross browser javascript widgets library. Because it is technology agnostic it can be encapsulated in JSP, JSF, .Net or PHP graphic components.
Click the image to open in full size.99.Scriptaculous
Script.aculo.us provides you with easy-to-use, compatible and, ultimately, totally cool! JavaScript libraries to make your web sites and web applications fly, Web 2.0 style. A lot of the more advanced Ajax support in Ruby on Rails (like visual effects, auto-completion, drag-and-drop and in-place-editing) uses this library.
Click the image to open in full size.100.SmartClient from Isomorphic Software
SmartClient is the cross-platform AJAX GUI system chosen by top commercial software vendors, on-demand service providers, and enterprise IT developers for thousands of deployments since 2000.
SmartClient provides a complete application stack, from rich, skinnable, extensible GUI components to declarative databinding and SOA integration, paired with a mature, searchable documentation suite and integrated tooling.
SmartClient AJAX applications run on Internet Explorer, Mozilla, Netscape, Firefox, and Safari web browsers, on Windows, MacOS, Linux, and Solaris. A Java integration server is provided, and SmartClient can also be integrated directly with any XML or JSON-based service without need of a server. Visit SmartClient.com for hundreds of live examples, browseable documentation and a downloadable SDK.
Click the image to open in full size.101.TIBCO General Interface (AJAX RIA Framework and IDE since 2001)
TIBCO General Interface is a mature AJAX RIA framework that’s been at work powering applicaitions at Fortune 100 and US Government organziations since 2001. Infact the framework is so mature, that TIBCO General Interface’s visual development tools themselves run in the browser alongside the AJAX RIAs as you create them.
ee an amazing demo in Jon Udell’s coverage at InfoWorld. http://weblog.infoworld.com/udell/2005/05/25.html
You can also download the next version of the product and get many sample applications from their developer community site via https://power.tibco.com/app/um/gi/newuser.jsp
Click the image to open in full size.102.Visual WebGui (The .NET answer to Google’s GWT that extends WinForms over ASP.NET)
Visual WebGui (VWG) is an open source AJAX framework with a growing community that extends ASP.NET with the WinForms programming model.
VWG provides an alternative to ASP.NET’s page model in the form of WinForms forms and form events. Since VWG, like most .NET AJAX frameworks, is implemented using an IHttpHandler, it can still interact with ASP.NET pages enabling usage of VWG within an existing ASP.NET site.
Click the image to open in full size.103.xWire
xWire is a mature, object-oriented, enterprise-class toolkit that consists of both client (browser) and server (Java) editions. You can use either or both editions depending upon your environment. xWire was originally built back in 2001 and originally supported only IE5. Support has expanded to IE6, IE7 and Firefox. Opera support is coming soon. You can literally write enterprise-class AJAX applications that work in all of the supported browsers. We have lots of features that can be independently used as desired on both the client and the server. Additionally, COMET support is on the way.
Click the image to open in full size.104.WebORB
WebORB is a platform for developing AJAX and Flash-based rich internet applications. The product is available for Java and .NET environments and includes a client side toolkit - Rich Client System to enable binding to server side objects (java, .net, web services, ejb, cold fusion), data paging and interactive messaging.
Click the image to open in full size.105.Zimbra
Zimbra is a recently released client/server open source email system. Buried deep within this product is an excellent Ajax Tool Kit component library (AjaxTK) written in Javascript. A fully featured demo of the product is available on zimbra.com, and showcases the extensive capabilities of their email client. A very large and comprehensive widget library as only avialable in commercial Ajax toolkits is now available to the open source community. Download the entire source tree to find the AJAX directory which includes example applications.
Click the image to open in full size.106.Bling!
MochiKit, Prototype, Scripaculous and OpenRico wrapped up into one package for Plone, isolating web developers from writing and debugging JS.
Click the image to open in full size.107.Behaviour
Separate Structure (xhtml) from Behavior (javascript)
Click the image to open in full size.108.WZ_DradDrop
A Cross-browser JavaScript DHTML Library which adds Drag Drop functionality to layers and to any desired image
Click the image to open in full size.109.WZ_jsGraphics
High Performance JavaScript Vector Graphics Library.
Click the image to open in full size.110.Nifty Corners
A small library for making rounded corners with Javascript.
Click the image to open in full size.111.TOXIC
Toxic is an AJAX toolkit, or framework, for creating rich web applications. It handles the tedious and repetetive tasks involved in integrating a client created using html and javascript with a server backend. It enables client side javascript to directly call class methods in PHP5 (or any other suitable language). It also enables the server side PHP to directly call client side javascript functions. Using Toxic you can get rid of much of the tedious work in form intensive rich web applications.
Click the image to open in full size.112.DOM-Drag
DOM-Drag is a lightweight, easy to use, dragging API for modern DHTML browsers.

113.AJFORM
AJFORM is a JavaScript toolkit which simply submits data from any given form in an HTML page, then sends the data to any specified JavaScript function. AJFORM degrades gracefully in every aspect. In other words, if the browser doesn’t support it, the data will be sent through the form as normal.


114.AJAXGear Toolkit
It is a toolkit that allows you to take advantage of the client-side technique known as AJAX. AJAX is shorthand for Asynchronous JavaScript and XML. It uses the XMLHttpRequest object to allow a Web browser to make asynchronous call to the Web server without the need to refresh the whole page.


115.Interactive Website Framework
A framework for creating highly interactive websites using javascript, css, xml, and html. Includes a custom xml parser for highly readable javascript. Essentially, all the plumbing for making AJAX-based websites, with js-based GUI toolkit.


116.JSPkg
jspkg is a package loader for Javascript, based on pluggable loaders for locating and loading scripts into a client-side Javascript application. It is designed to work best with unobtrusive Javascript libraries, but doesn’t impose any methodology or design on its users.


117.Ajaxcaller
AjaxCaller is a thin XMLHttpRequest wrapper used in all the AjaxPatterns demos. The focus is on ease-of-use and full HTTP method support.


118.XOAD
XOAD, formerly known as NAJAX, is a PHP based AJAX/XAP object oriented framework that allows you to create richer web applications.


119.PAJAJ
What is the PAJAJ framework, it stands for (PHP Asynchronous Javascript and JSON). It is a object oriented Ajax framework written in PHP5 for development of event driven PHP web applications.

120.PEAR: HTML_AJAX
Provides PHP and JavaScript libraries for performing AJAX (Communication from JavaScript to your server without reloading the page)


121.Flexible AJA
Flexible Ajax is a handler to combine the remote scripting technology, also known as AJAX (Asynchronous Javascript and XML), with a php-based backend.


122.FlashObject
FlashObject is a small Javascript file used for embedding Macromedia Flash content.

123.OSFlash - Flashjs
The Flash JavaScript Integration Kit allows developers to get the best of the Flash and HTML worlds by enabling JavaScript to invoke ActionScript functions, and vice versa.


124.jWic
jWic is a java-based development framework for developing dynamic web applications with the convenience and familiarity of ‘rich client’ style programming. The component-based, event-driven programming model makes it easy for developers to quickly create flexible and robust web applications.


125.JSMX
JSMX is an Ultra Lightweight - Language Agnostic - Ajax Framework. It is by far the easiest way to integrate Ajax into any Web Application. What separates JSMX from most other Ajax Frameworks is that the JSMX API runs entirely on the client and has no Server Side Components to install. Given this fact plus the fact that you can pass back JavaScript, XML, JSON, or WDDX makes JSMX a truly Universal Ajax API.


126.DreamFace Interactive
DreamFace Interactive, a member of the OpenAjax Alliance, provides a new way for Web-savvy business people to create, control, and share their own Web applications, through a concept called WebChannels, which makes it possible to create applications designed for change.


127. DOMAssistant
A completely modular lightweight JavaScript library.


128.JavaScriptMVC
JavaScriptMVC is a framework that brings methods to the madness of JavaScript development.

回覆時引用此篇文章
回覆
LinkBacks (?)
LinkBack to this Thread: http://forum.j2eemx.com/forum34/thread1026.html
作者 For Type 日期
Carousel 3d Flash Slideshow Demo : Free Flash SlideShow Maker This thread Refback 2011-04-12 03:53 PM
Put Slideshow On Plone Site : Free SlideShow Software This thread Refback 2010-07-29 12:03 PM
prototype.js源码解读(二) - Netsuite工作日志-国内顶级B/S架构多系统一平台软件 - 博客园 This thread Refback 2010-04-05 04:56 PM


主題工具
顯示模式

發表文章規則
不允許您發表新主題
不允許您發表文章
不允許您上傳附件
不允許您編輯自已的文章

開啟 BB 代碼
關閉 HTML 程式碼
Trackbacks are 關閉
Pingbacks are 關閉
Refbacks are 開啟



所有時間均為 +8。現在的時間是 01:40 PM
Powered by vBulletin® 版本 3.7.2
版權所有 ©2000 - 2018,Jelsoft Enterprises Ltd.
Advertisement System V2.6 By   Branden
RiS 社群 ( 感謝正洋資訊顧問有限公司技術指導 ) - 使用3.7.2永久合法版權。
Ad Management by RedTyger



Content Relevant URLs by vBSEO 3.6.0 PL2