列表生成器（js）2

已经傻掉的我：虽然这个功能已经基本可以实现，但是这个错误，我实在是找不出来是哪里出现的问题：（还请大佬多多指教！！！）

我也自己进行查找，可能是我理解的问题，还是不知道如何操作！！

改良的代码如下：
css代码：
.list{
display:inline-block;
background:#fff;
color:#333;
text-align:left;
font-size:20px;
}
.list-ul{
list-style:none;
margin:0;
padding:0;
}
.list-option{
padding:6px 0;
}
.list-input{
width:300px;
border:1px solid #ccc;
padding:4px;
font-size:14px;
color:#333;
}
.list-input:hover{
background:#effaff;
}
.list-btn span{
color:#0065A0;
cursor:pointer;
}
.list-btn span:hover{
text-decoration:underline;
}
.list-bottom{margin-top:5px;}
.list-add-show{
color:#f60;
cursor:pointer;
}
.list-add-show:before{
position:relative;
top:1px;
margin-right:5px;
content:"+";
font-weight:700;
font-size:20px;
}
.list-add-add{
cursor:pointer;
}
.list-add-cancel{
cursor:pointer;
}
.list-add-input{
width:180px;
border:1px solid #ccc;
padding:4px;
font-size:14px;
color:#333;
}
.list-add-input:hover{background:#effaff;}
.list-hide{display:none;}

body代码：

• [上移] [下移] [删除]

添加项目

添加到列表：

			</div>
		</div>
		
	</form>	
	
	<script src="SmartList.js"></script>
	<script type="text/javascript">
	 SmartList('list',['PHP','JavaScript']);
	</script>

SmartList.js文件：

(function (window){
var Smartlist=function(prefix,defList){//构造函数
Find.prototype.prefix=prefix;
var find=new Find(document.getElementsByClassName(prefix)[0]);//获取list对象
var list=new List(find.className(‘option’));
for(var i in defList){
list.add(defList[i]);
}
var add={
‘show’: find.className(‘add-show’),//获取"添加项目"元素对象
‘area’: find.className(‘add-area’),//获取添加区域块的元素对象
‘input’: find.className(‘add-input’),//获取添加的文本框元素对象
‘add’: find.className(‘add-add’),//获取添加按钮的元素对象
‘cancel’: find.className(‘add=cancel’)//获取取消按钮的元素对象
};

	add.show.onclick=function(){//控制添加区域的显示隐藏
		add.area.classList.remove(prefix+'-hide');
	};
	add.add.onclick=function(){//添加到列表
		list.add(add.input.value);
	};
	add.cancel.onclick=function(){ //添加删除
		add.area.classList.add(prefix+'-hide');
	};
};

function List(tmp){//创建列表对象
	this.tmp=tmp;
	this.obj=tmp.parentNode;//保留模板中的父节点对象
	this.obj.removeChild(tmp);//移除ul中的li模板
	
}
List.prototype={
	add:function(value){
		var tmp=this.tmp.cloneNode(true);//复制当前节点
		
		var find=new Find(tmp);
		//将value添加到list-input的value属性中
		find.className('input').value=value;
		var obj=this.obj;//父节点
		find.className('up').onclick=function(){
			var prev=find.prev();
			if(prev){
				obj.insertBefore(tmp,prev);
				
			}else{
				alert('已经是第一个');
				
			}
		};
		find.className('down').onclick=function(){
			var next=finf.next();
			if(next){
				obj.insertBefore(next,tmp);
				
			}else{
				alert('已经是最后一个');
				
			}
		};
		find.className('del').onclick=function(){
			if(confirm('您确定要删除?')){
				obj.removeChild(tmp);
		}
	};
	//将创建的列表项添加到列表末尾
	this.obj.appendChild(tmp);
	}
};

function Find(obj){
	this.obj=obj;
}
Find.prototype={
	prefix:'',
	className: function(className){
		return this.obj.getElementsByClassName(this.prefix+'-'+className)[0];//返回list-option对象
	},
	prev:function(){
		var node=this.obj.previousSibling;//获取当前对象的前一个节点
		while(node){
			if(node.nodeType===Node.ELEMENT_NODE){
				break;
			}
			node=node.previousSibling;
			
		}
		return node;
		
	},
	net:function(){
		var node=this.obj.nextSibling;//获取当前对象的后一各节点
		while(node){
			if(node.nodeType===Node.ELEMENT_NODE){//检测是否为节点
				break;
			}
			node=node.nextSibling;
		}
		return node;
	},
	
};
window['SmartList']=Smartlist;

})(window);