Apex开发--自定义按钮加Loading Spinner

学习目的
1，在自定义按钮里加Loading Spinner提升客户体验

Salesforce Custom Button or Link Detail

在Salesforce中在Detail Page里能够自定义按钮。然后由于中国网络的因素或者后台处理逻辑过长，可以添加一个Loading Spinner效果。

自定义按钮里加Loading Spinner

上代码

{!REQUIRESCRIPT("/soap/ajax/41.0/connection.js")}
{!REQUIRESCRIPT("/soap/ajax/41.0/apex.js")}
// Create a background and show the image on top
div = document.createElement('div');
div.id = 'myDiv';
div.style.width = '100%';
div.style.height = '100%';
div.style.position = 'fixed';
div.style.top = document.body.scrollTop;
div.style.left = document.body.scrollLeft;
div.style.backgroundColor = 'black';
div.style.opacity = '0.5';
div.style.zIndex = '100';
document.body.appendChild(div);

img = document.createElement('img');
img.id = 'myImg';
img.src = '/resource/1535627232000/loading'; //把Loading Spinner的图片放到你的静态资源里面
img.style.position = 'absolute';
img.style.top = '45%';
img.style.left = '45%';
img.style.zIndex = '101';
div.appendChild(img);
setTimeout(function () {
	var result = sforce.apex.execute("xxxxx Apex Class Name", "Apex Method",   {Param: "{!Trainning__c.Id}"});
	if (result == "ok") {
		window.location.reload();
	} else {
		alert('sync faliure,please contact IT support');
		div.style.display = 'none';
		img.style.display = 'none';
		window.location.reload();
	}
}, 500); //delay 500ms

使用的方式就是：使用js 的document去创建一个遮罩层。

如果内容有错误，请及时指出。一起学习，一起进步！