[ 共享 ]一个封装的提示类，请多指教

[tianshul8]

demo : http://www.hotoo.cn/demo/javascript/Tip.htm

<script language="JavaScript">
<!--

/** Tip.js [class]
* @description 闲耘喜欢的一种提示方式
* IE 6.0, firefox 1.0, Opera 8.0 通过测试
* @version 1.2.0
*
* @author 闲耘 (HoToo)
* @author [e-mail]
*
* @create 2006-5-22
* @update 2006-5-23
*
*/
function Tip( object, text ){
this.object = object ;
this.div = null ;
this.text = text ;
this.delay = 3000 ; // after 3 second, this object well destroy.
this.parent = null ;
this.style = {
'left' : 0 ,
'top' : 0 ,
'width' : 200 ,
'height' : 20 ,
'position' : 'absolute' , // '', 'relative', 'static', 'fixed', 'inherit'.
'border' : '1px solid #cccccc' ,
'backgroundColor' : '#eeeeee' ,
'fontSize' : 13 ,
'color' : '#999999' ,
'lineHeight' : 2 ,
'fontWeight' : 'bold' ,
'textAlign' : 'center' ,
//! 'float' : 'right' , // throw exception in firefox 1.0.
'zIndex' : 100
} ;
var ME = this ;

var withPx = 'left,top,width,height,fontSize,lineHeight' ;

this.isFloating = function(){
return (this.style['position'] == 'absolute') || (this.object == null) ;
}
this.setStyle = function( oStyle ){
for ( var key in oStyle ) {
eval( 'this.style["' + key + '"] = "' + oStyle[key] + '" ;' ) ;
}
}
this.setDelay = function( delay ){
this.delay = delay ;
}
this.setText = function( text ){
this.text = text ;
}
this.display = function( ){ // normal.
this.isFloating() ? this.div.style.visibility = 'visible' : this.div.style.display = 'block' ;
}
this.displayEval = function( ){ // when using eval method.
ME.isFloating() ? ME.div.style.visibility = 'visible' : ME.div.style.display = 'block' ;
}
this.hidden = function(){ // normal.
this.isFloating() ? this.div.style.visibility = 'hidden' : this.div.style.display = 'none' ;
}
this.hiddenEval = function(){ // when using eval method.
ME.isFloating() ? ME.div.style.visibility = 'hidden' : ME.div.style.display = 'none' ;
}
this.create = function(){
this.div = document.createElement('div');
for ( var key in this.style ) {
eval( 'this.div.style.' + key + ' = "' + this.style[key] + '" ;' ) ;
}
if ( this.isFloating() ) {
this.div.style.top = parseInt(document.body.scrollTop) + parseInt(this.style['top']) ;
this.div.style.left = parseInt(document.body.scrollLeft) + parseInt(document.body.clientWidth) - parseInt(this.style['width']) - 4 ;
document.body.appendChild( this.div );
} else {
document.body.insertBefore( this.div, this.object );
}
this.div.innerHTML = this.text ;
setTimeout(eval('this.timeout'), this.delay);
}
this.remove = function(){
document.body.removeChild( this.div );
this.div = null ;
}
this.timeout = function(){
ME.remove();
//! this.remove();
// document.body.removeChild( ME.div );
//! document.body.removeChild( this.div );
}
}
//-->
</script>


<br /><br /><br /><br /><br /><br /><br /><br /><br />
<div id='Mydiv'>提交</div>
<div id='Mydiv2'>删除</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<script language="JavaScript"><!--

var t = new Tip( document.getElementById('Mydiv'), "提交成功");
t.setDelay(5000);
t.setStyle({
'left' : 0 ,
'top' : 0 ,
'width' : 200 ,
'height' : 20 ,
'position' : '' ,
'border' : '1px solid #cccccc' ,
'backgroundColor' : '#ff6666' ,
'fontSize' : 12 ,
'color' : '#ffffff' ,
'lineHeight' : 2 ,
'fontWeight' : 'bold' ,
'textAlign' : 'center' ,
'zIndex' : 100
}) ;
t.create();

function cr(){
var t2 = new Tip( document.getElementById('Mydiv2'), "删除成功");
t2.setStyle({'position' : '', 'width' : 200 , 'top' : 20});
t2.create();
}
setTimeout('cr()', 1000);

//setTimeout('t.hidden()', 1000);

var t3 = new Tip(null, "HoHo");
setTimeout('t3.create()', 3000);

//--></script>

[meizz]

有一定的水准，但代码还不太精炼，有些地方还不够严谨。

[tianshul8]

感谢梅子
这是闲耘写成功的第一个封装类
有问题是自然的

希望能听到实际点的建议
：）

[meizz]

this.delay = delay ;
比如象这样的赋值，其实已经没有太多意义，因为你这个变量已经暴露了即public了，外面是可以直接调用到的，所以你的这种函数赋值还不如直接调用这个成员属性。

要想实现私用的成员你可以这样：
function Class()
{
var _delay = 0;
this.setDelay = function(delay)
{
_delay = delay ;
}
this.getDelay = function()
{
return _delay;
}
}
这样的变量才是 private 的，外面也调用不到的，这是我说你不够精简的一个方面，还有就是你这种功能可以用更简单的思路实现。

至于不够严谨的话，我是指你展现所用的层是用DIV的，这种元素会被 Flash <OBJECT> <SELECT>所遮挡，严谨的话你应该把这些很现实的问题也考虑进去。可以盖住这些元素的层载体你可以选择使用 window.createPopup() 或者 <iframe>。

[tianshul8]

菲浅受益~~`