apicloud在列表页面中实现删除功能-马育民老师

页面的实现部分参见文章：[apicloud文章列表页面（dot模版引擎）](http://www.malaoshi.top/show_1EF8nkHSRlB.html "apicloud文章列表页面（dot模版引擎）")

####删除成功后，不能刷新页面，原因如下：
1.刷新页面后，页面会滚动到顶部，数据会全部刷新，影响用户使用
2.要请求数据，有网络延迟，影响用户体验
3.向服务器请求数据，会给服务器造成负担

####解决方案：
删除当前节点
jquery代码是：
```javascript
$("#id").remove();
```

####修改模版
1. 在模版中增加删除按钮，
2. 在div中增加id，id值前缀为固定，后面部分是该条记录的主键id

```javascript
<script id="articleTemp" type="text/x-dot-template">
        {{~it:value:index}}
            <div onclick='showById("{{= value.id }}")' id="article_{{= value.id }}">
            	{{= index+1 }}.{{= value.title }}  {{= value.creatorName }}==={{= value.viewNum }}
            </div>
            <input type="button" value="删除" onclick="del('{{= value.id }}')" />
        {{~}}
    </script>
```

####实现删除函数
删除成功后将当前div删除掉
```
function del(id){
		if(confirm('您确定要删除吗？')){
			var client = new Resource(APP_INFO.app_id, APP_INFO.app_key);
			var Model = client.Factory("article");
			Model.delete({"_id":id},function(ret,err){
			    if(err){
			        //处理错误 err
			    }else{
			        //处理数据 ret
			        //alert(JSON.stringify(ret));
			        $("#article_"+id).remove();//删除成功后将当前div删除掉
			    }
			})
		}
	}

```

原文出处：https://malaoshi.top/show_1EFA6kbjzFw.html