说完了事件驱动的JScript面对象编程。我们来看看一个具体的例子：程序运行的例子如下：
点击文字看看。
程序的源代码如下：
<html><body>
<script language="jscript">
function EditableText(_owner){
this.owner = _owner;
this.edit = document.createElement("input");
this.edit.type = "text";
this.edit.onblur = this.onEditBlur;
this.edit.onclick = this.onEditClick;
this.edit.obj = this;
this.span = document.createElement("span");
this.span.innerText = "EditableText";
this.span.obj = this;
this.span.onclick = this.onSpanClick;
this.owner.appendChild(this.span);
}
function EditableText.prototype.onEditClick(){
event.cancelBubble = true;
}
function EditableText.prototype.onEditBlur(){
event.cancelBubble = true;
var self = this.obj;
self.span.innerHTML = "";
self.span.innerText = self.edit.value;
}
function EditableText.prototype.onSpanClick(){
event.cancelBubble = true;
var self = this.obj;
self.edit.value = http://www.dedecms.com/web-art/htmlbase/Javascript/20050427/this.innerText;
this.innerHTML = "";
this.appendChild(self.edit);
self.edit.focus();
}
////////////////////////////////////////////////////////////
function init(){
for(var i=0;i<20;i++){
new EditableText(document.body);
var br = document.createElement("br");
document.body.appendChild(br);
}
}
init();
</script>
</body>
</html>
注意程序后面的init函数。里面的new EditableText(document.body)只是建立了对象。但是我并无保存建立的对象的引用。而是让对象自己去管理自己。对象的行为都是由事件来驱动的(onclick和onblur),而无须别外的辅助代码。
欢迎您访问www.5ucms.org
| 上一篇：5ucms插件,JavaScript基础实例:如何计算24点 下一篇：5ucms模版,计算24点 |
|
| 本站声明：本网站所载文章等内容，目的在于传递更多信息，并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权及其它问题，请在30日内与本网联系（Email：3876307#qq.com），我们将在第一时间删除内容。若原创内容转载请注明出处。 5ucms模版,事件驱动的JScript面对象编程（例）的关键词: |
|
相关分类
本类最新
