前端经常使用效果(layer/swal)

1.等待状态javascript

layer.load(1, {
		shade : [ 0.6, '#000' ]
	    },function(){ 
	    });

2.确认confirm框html

layer.confirm('您确认从购物车中移除该课程吗?', {
				btn : [ '肯定', '取消' ]
			}, function() {
                var url = hostUrl + '/stuCourse/deleteCart.json';
				var data = {
					id : id
				};
				var success = function(json) {
					if (json.success) {
						layer.closeAll('dialog');
						//window.location.reload();
						var url=hostUrl+"/stuCourse/courseQuery2/"+$("#sno").val()+
                                                        "?schoolId="+$("#schoolId").val()+
                                                        "&teacherId="+$("#teacherId").val()+
                                                        "&gradeId="+$("#grade").val()+
                                                        "&subjectId="+$("#subject").val()+
                                                        "&termId="+$("#term").val()+
                                                        "&levelId="+$("#level").val()+
                                                        "&keyword="+$("#keyword").val()+
                                                        /* "&sno="+$("#sno").val()+ */
                                                        "&limit="+$("#limit").val()+
                                                        "&offset="+$("#offset").val();
                       window.location.href=url;
					} else {
						layer.msg("移除失败,请稍候再试...", {
							icon : 5
						});
					}
				};
				T.ajaxPostJsonResult(url, data, success, null);
			});

3.错误提示框java

swal("付款金额总数不对哦!", "", "error");

4.确认框ajax

swal({
                title: "确认收到该订单的付款?",
                text: "",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#1c84c6",
                confirmButtonText: "肯定",
                cancelButtonText: "取消",
                closeOnConfirm: false,
                closeOnCancel: false
            }, function (isConfirm) {
                if (isConfirm) {
                  ……
                }
                else {
                    swal("已取消", "您取消了付款报名操做!", "error");
                }
             })

5.提示框json

swal({
                                    title: "报名成功!",
                                    text: json.msg,
                                    type:"success"
                                },function(){
                                    window.location.href =  
                                });

6.图片查看this

<div class="col-sm-12 m-t">
            <div class="col-sm-12 m-t" id="showCon">
                <div class="img-group">
                    <div class="top-tip">
                        <div class="mask"></div>
                        <div class="tip-content">
                            <i class="fa fa-search" data-toggle="modal" data-target="#bigPic"></i>
                        </div>
                    </div>
                    <img src="images/user.jpeg">
                </div>
            </div>
 </div>
<!-- 图片查看 -->
    <div class="modal fade" id="bigPic" tabindex="-1" role="dialog" aria-labelledby="myLessonLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title" id="myLessonLabel">查看图片</h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-12" id="showPic">
                            <img class="img-preview" src=''>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
$("#showCon").on("click",".fa-search",function(){
        bigImg($(this));
    });
function bigImg(obj){
    var showPic = $("#showPic");
    var bigImg = showPic.find("img");
    var src = obj.parent().parent().siblings("img").prop("src");
    bigImg.prop("src","");
    bigImg.prop("src",src);
}

layer.msg("难过脸,失败", {
                    icon : 5
        });url

layer.msg("勾,成功", {
                    icon : 1
        });spa

相关文章
相关标签/搜索