你的位置:首页 > Java教程

[Java教程]mui h5 动态实现数据的移除和数据操作完后的重新获取


HTML 代码

<ul id="OA_task_1">
<li >
<div >
<a >企业联系人</a>
<a >移除</a>
</div>
<div ><img src="images/img42.png">
<div >
<div >萌萌哒天团萌萌哒天团萌萌哒天团萌萌哒天团</div>
<p >企业联系人</p>
</div>
<div >
<p >2016年1月5日</p>
</div>
</div>
</li>
<li >
<div >
<a >企业联系人</a>
<a >移除</a>
</div>
<div ><img src="images/imgPPT.png">
<div >
<div >T-ARA</div>
</div>
<div >
<p >2016年1月5日</p>
</div>
</div>
</li>
</ul>

 

js代码

//添加企业联系人
(function($) {
$('#OA_task_1').on('tap', '.mui-btn-col', function(event) {
var elem = this;
var id = this.getAttribute('id');
var li = elem.parentNode.parentNode;
elem.class = 'mui-btn mui-btn-bule';
mui.confirm('确定添加该员工为企业联系人?', '提示', btnArray, function(e) {
if (e.index == 0) {
var ajaxUrl=getajaxUrl();
var url = ajaxUrl[0]['nativeIp']+"/mobile/labour/iscontacts";
mui.ajax(url,{
data:{
id:id,
type:"1"
},
dataType:'json',//服务器返回json格式数据
type:'post',//HTTP请求类型
timeout:10000,//超时时间设置为10秒;
success:function(data){
var result = eval(data);
result = eval(result);
if(result[0]['isok']){
$.swipeoutClose(li);
var divp="<p class='mui-pull-left pl-bule'>企业联系人</p>"
var contact = "<a id="+result[0].newlabour.id+" class='mui-btn mui-btn-bule'>企业联系人</a>"
li.innerHTML = '<div id="">'+contact+'<a id="'+result[0].newlabour.id+'" >移除</a></div><div ><img src="http://www.cnblogs.com//'+result[0].user.headimg+'"><div ><div >'+result[0].user.nickname+'</div>'+divp+'</div><div ><p >'+result[0].newlabour.updatetime+'</p></div></div>'
mui.toast('该员工已成为企业联系人!');

}
},
error:function(xhr,type,errorThrown){
//异常处理;
console.log(type);
}
});
}
else {
setTimeout(function() {
$.swipeoutClose(li);
}, 0);
}
});
});
var btnArray = ['确定', '取消'];
})(mui);
//移除企业联系人
(function($) {
$('#OA_task_1').on('tap', '.mui-btn-bule', function(event) {
var user = JSON.parse(plus.storage.getItem("user"))
var elem = this;
var id = this.getAttribute('id');
var li = elem.parentNode.parentNode;
mui.confirm('确定取消该员工为企业联系人?', '提示', btnArray, function(e) {
if (e.index == 0) {
var ajaxUrl=getajaxUrl();
var url = ajaxUrl[0]['nativeIp']+"/mobile/labour/iscontacts";
mui.ajax(url,{
data:{
id:id,
type:"0"
},
dataType:'json',//服务器返回json格式数据
type:'post',//HTTP请求类型
timeout:10000,//超时时间设置为10秒;
success:function(data){
var result = eval(data);
result = eval(result);
if(result[0]['isok']){
$.swipeoutClose(li);
var divp=""
var contact = "<a id="+result[0].newlabour.id+" class='mui-btn mui-btn-col'>企业联系人</a>"
li.innerHTML = '<div id="">'+contact+'<a id="'+result[0].newlabour.id+'" >移除</a></div><div ><img src="http://www.cnblogs.com//'+result[0].user.headimg+'"><div ><div >'+result[0].user.nickname+'</div>'+divp+'</div><div ><p >'+result[0].newlabour.updatetime+'</p></div></div>'
mui.toast('成功移除企业联系人!');
}
},
error:function(xhr,type,errorThrown){
//异常处理;
console.log(type);
}
});
}
else {
setTimeout(function() {
$.swipeoutClose(li);
}, 0);
}
});
});
var btnArray = ['确定', '取消'];
})(mui);

实现效果