Ajax发送请求等待时弹出模态框等待提示

主要的代码分为两块，一个是CSS定义模态框，另一个是在Ajax中弹出模态框。

查看菜鸟教程中的模态框教程demo，http://www.runoob.com/try/try.php?filename=bootstrap3-plugin-modal点击打开链接

	 
	
	
	
	



创建模态框（Modal）


	开始演示模态框



	

		

			

				
					×
				
				

					模态框（Modal）标题
				
			
			

				在这里添加一些文本
			
			

				关闭
				
				
					提交更改
				
			
		

	

注意：

是写在下一级的。

这里的按钮开始演示模态框触发模态框。

我的项目中用的代码：

css部分：

		


			

				

					
					
正在测试数据库连接
				
				

					
连接中，请稍候...
				
			

		

	

触发部分：

$.ajax({
					type: 'POST',
					url: 'api/manager/resource/connect/testConnect',
					data: {dbTypeId: dbTypeId, jdbcIp: jdbcIp, jdbcPort: jdbcPort, dbName: dbName, uName: uName, uPwd: uPwd, datadbType: dbType, dbVersion:dbVersion} ,
					dataType: 'json',
					beforeSend: function(){       //ajax发送请求时的操作，得到请求结果前有效
						$('#myModal').modal({
							backdrop:'static'      //设置模态框之外点击无效
						});
						$('#myModal').modal('show');   //弹出模态框
					},
					complete: function(){            //ajax得到请求结果后的操作
						$('#myModal').modal('hide');  //隐藏模态框
					},
					success: function(msg) {
						if (msg.code == 1) {
//							jAlert('！', '提示');
							$.pnotify({title: "提示",text:"数据库连接正常!",type: 'info', delay: 3000});

						} else {
//							jAlert(msg.msg, '提示');
							$.pnotify({title: "错误",text:msg.msg,type: 'error', delay: 3000});
						}
					}
				});