您的位置:首页 > Web前端 > JavaScript

从js给页面动态添加标签并赋值,多次点击响应数据重复

2017-12-28 16:51 776 查看
js中有个点击事件,当点击列表某值后执行
onClick: function(event, treeId, treeNode) {
loadTemplateData(treeNode.id);
}
异步取值并填充到页面
var loadTemplateData = function(templateId){
loadTempLate();
if(templateId && templateId !== ''){
cu.showLoadding();//打开遮罩防止多次点击数据填重
AJAX.init().success(function(code,msg,data){
if(data){
var template = data.template;
var questions = data.questions;
var users = data.users;
//主模板
$('#tempName').textbox('setValue',template.tempname);
$('#tempId').val(template.tempid);
$('#tempType').combobox('select',template.temptype);
$('#totalFraction').textbox('setValue',template.totalfraction);
$('#templateDetail').textbox('setValue',template.remark);

//考核项
if(questions && questions.length >0){
$('#content').find('#cont').remove();
}
var html = '';
$.each(questions,function(i,item){
var points_info = item.points_info;
if(points_info==undefined){
points_info="";
}
html += '<tr id="cont">'
+'<td id="indicator"><input type="hidden" name="qId" value="'+item.qid+'"><input type="text" style="width:200px;" data-options="width:100,validType:\'maxlength[60]\'" class=" easyui-textbox textbox-text" name="indicator" value="'+item.indicator+'"></td>'
+'<td id="indicator_info"><input style="width:200px;" type="text" class="easyui-textbox textbox-text" data-options="width:100,validType:\'maxlength[60]\'" name="indicator_info" value="'+item.indicator_info+'"></td>'
+'<td id="points"> <input style="width:200px;" type="number" class="easyui-textbox textbox-text" data-options="width:100,validType:\'maxlength[10]\'" name="points" value="'+parseFloat(item.points)+'"></td>'
+'<td id="points_info"> <input type="text"  style="width:200px;"class="easyui-textbox textbox-text" data-options="width:100,validType:\'maxlength[60]\'" name="points_info" value="'+points_info+'"></td>'
+'<td> <a href="javascript:void(0)" class="vitobtn aadBtn" type="buttons" id="delete">删除</a> </td> </tr>';

//初始化表单中的验证器
$('input[type!="hidden"],select,textarea',$('#content') ).each(function(){
$(this).validatebox();
});

$('input[name="points"]',$('#content') ).each(function(){
//$(this).numberbox();
});
});
$('#content').append(html);
//参与人
var userIds=[];
var names=[];
var count = users.length;
$.each(users,function(i,item){
userIds.push(item.userid);
names.push(item.name);
});
$("#joinerUserName").textbox('setValue',names);
$("input[name='joinerUserId']").val(userIds);
$("input[name=memberCount]").val(count);
cu.hideLoadding();
}
}).post(BASEPATH+'/oa/performance/queryTemplateById.htm?templateId='+templateId);
}
};
但是多次连击会出现页面数据重复多次,解决办法就是在数据未加载完成之前点击有遮罩
4000
效果,此处遮罩是我oa项目中的,只需调用就行
var cu = require("resource/js/component/commonUtil.js");

                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: