sweetalert book

 

官网

https://sweetalert.bootcss.com/guides/

https://sweetalert.js.org/docs/

 

如何使用

不需要css, 只要js即可。

BootCDN 已经收录了 SweetAlert 并为其提供免费的 CDN 加速支持，将其引入你的页面并直接使用全局的 swal 变量即可。

<script src="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.js"></script>

 

样例

swal("Hello world!");

 

 

 

sweetalert确认弹窗

function upload(){
	var fileName = $("#filename")[0].innerHTML;	//获取文件名
    var ext = fileName.substring(fileName.lastIndexOf(".")+1, fileName.length).toLowerCase();
		if (ext == 'txt') {	//判断文件类型
		swal({	
			icon: "warning",
			title: [[#{confirmUpload}]],	//thymeleaf取国际化文件中的值
			text: [[#{cannotdeleteimort}]],
			buttons:{
				cancel: {	//取消按钮
				    text: [[#{cancel}]],
				    value: null,
				    visible: true
				},
				  confirm: {	//确认按钮
				    text: [[#{comfirm}]],
				    value: true,
				    visible: true
				  }
			}
		}).then(function(isOk){		//判断是否点击确认
			if(!isOk)	//如果点击取消
				swal.close();
			else{
				$("#uploadForm").ajaxSubmit({	//点击确认
	    			type: "post",
	    			url:'/xxx/xxx',
	    			data: $("#uploadForm").serialize(),
	    			dataType: "text",
	    			cache: false,
	    			beforeSend: function(){
						swal({
							icon: "info",
								text:[[#{importing}]]
							});
	    			}, 
	    			complete: function(){  
	    			    swal.close();
	    			},
	    			error : function(textStatus, errorThrown) {
						swal({
							icon: "error",
							text:[[#{importFail}]]+textStatus
						});
	       			},
	   			    success: function(data){
	   			    	if(data=="x")
    					    swal([[#{x}]]);
	   					else 
	    					swal(data);
	    			}
	    		});
			}
		});
	}else{//上傳文件應該是.txt
		swal({
			icon: "error",
			text:[[#{txtfile}]]
		});
	}
}

 

 

 

引用自: https://blog.csdn.net/w1529132313/article/details/103461034

 

 

其它文章

https://zhuanlan.zhihu.com/p/151067898