JQ 使用弹窗打开项目的页面

先引入JQ

 <script src="/static/pc/js/jquery.1.8.2.js"></script>

 封装方法：

function OPENPAGE(config){
    let iframe_id='xxx_'+parseInt(Math.random()*100000)
    $('body').append(`<div class="iframeDiv d-f a-i-c j-c-c" id='iframe_${iframe_id}' style='display:none;'>
          <iframe  scrolling="no" name='iframe_${iframe_id}' style='width:${config.width || '80%'};height:${config.height || '60%'}' src="${config.src}"></iframe>
      </div>`)
      setTimeout(()=>{
        $("#iframe_"+iframe_id).fadeIn(300);
        $(window.frames["iframe_"+iframe_id].document).find('body').css({
          'width':`${config.width}`,
          'height':`${config.height}`,
          'background-color':'#fff'
        })
        $(window.frames["iframe_"+iframe_id].document).on('click','.close_btn',function(){
          $("#iframe_"+iframe_id).remove();
          if(config.close){
            config.close(true)
          }
        })
        if(config.success){
          config.success(true)
        }
      },300)
    
  }
  $.openPage=function(config){

    return new OPENPAGE(config);
  }

 使用

 

   $.openPage({
        src:'/html/order/eidt.html',
        width:'500px',
        height:'400px',
        success:(res)=>{
            console.log(res,'success')
        },
        close:(res)=>{
            console.log(res,'close')
        },
    })