bootstrap modal弹出框

4 篇文章 0 订阅
3 篇文章 0 订阅

最近在web开发过程中需要做一个弹出框,通过看导师的代码和上网查阅了相关资料,最后完成了这个弹出框。

具体实现功能为,当我点击日志按钮时,会出现一个弹出框,显示该日志的内容,如果点击弹出框的关闭或者右上方的退出按钮,该弹出框就会退出。

html代码,这是标准格式:


js代码:这是实现的核心部分:

 var SAVE_DATA = { //JSON格式的数组
    'logpath' : '',
    'actId' : 0,
    'logContentResult' : -1
}; 
 function getAjaxLogFunc(iId){    
    // 关闭按钮无法关闭modal
    $('#btnCloseLogContent').unbind( 'click' ); //移除click事件处理程序
    $('#btnCloseLogContent').attr( 'class', 'btn btn-primary disabled' );

    // show upload progress dialog
    $('#logContentProgress').modal({
        backdrop: 'static',  
        keyboard: false
    });
    $("#loadImg").show();  //显示图片
    $("#importStatus").html(""); //获取第一个元素的html内容
    $.getJSON(
        'index.php', 
        { 'action':'get_actlog_content', 'logiId':  iId},
        function(result){
            if( SAVE_DATA.logContentResult == -1 ){
                $("#importStatus").html(result.sMsg);
            }else{
                $("#importStatus").html(result.sMsg);
                $("#loadImg").hide();  //隐藏图片
                $('#btnCloseLogContent').attr( 'class', 'btn btn-primary' );
                $('#btnCloseLogContent').click( function(){
                    $('#logContentProgress').modal('hide');     
                });
                $('#btnCloseFork').click( function(){
                    $('#logContentProgress').modal('hide');
                });
            }
    });
}



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值