资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

怎么在layui中利用layer组件实现一个弹出层-创新互联

这期内容当中小编将会给大家带来有关怎么在layui中利用layer组件实现一个弹出层,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。

我们提供的服务有:成都网站建设、网站制作、微信公众号开发、网站优化、网站认证、都昌ssl等。为上千家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的都昌网站制作公司

代码实现:




  
  弹出层
  
  


申请提现

 


 
  $('#pro').on('click',function(){
    //提现弹窗之前进行一定判断伪代码
    //上述条件符合之后,弹出提现弹窗
    layui.use('layer', function() {
      var layer = layui.layer;
      layer.open({
        type: 2,
        // skin: 'layui-layer-molv',
        title: '申请提现',
        content:['/kk.php','no'] ,//不允许出现滚动条
        area:['600px', '400px']
      });
    });
 
  // });
})
  

kk.php




  
  Document
  
  
  
    .aa{margin-top: 7%; font-size: 14px;}
    .bb {margin-top: 10%;}
    .aa .cc{
      float: right;
      margin-top: -11px;
      position: absolute;
      right: 30px;
      top: 50%;
    }
    .aa .account{
      border: 1px solid #10ad15;
      color:#10ad15;
      border-radius: 4px;
      padding: 20px;
      position: relative;
    }
    .txt{width: 410px; margin:30px; font-size: 16px; color: #333;}
    .layui-btn {
      display: inline-block;
      height: 38px;
      line-height: 38px;
      padding: 0 18px;
      background-color: #ffa751;
      color: #fff;
      text-align: center;
      border: none;
      border-radius: 2px;
      cursor: pointer;
      font-size: 16px;
      vertical-align: middle;
      margin-left: 25px;
 
    }
    input[type="text"]{
      word-wrap: break-word;width: 240px;height: 38px;
      border-radius: 4px; padding: 0 5px;border: 1px solid #ddd;
      display:inline-block; margin:0px 10px;
    }
 
  


 

       输入提现金额                 

提现到建设银行

      我的建设银行(546513212315451)
    
  
 
确认提现     $("#layui-btnn").on('click',function(){     layui.use('layer', function() {       var layer = layui.layer;//引入layer组件       var money_request=$('#money_request').val();//获取用户输入的提现金额'         //判断用户输入的提现金额是否为空       if(money_request==''){         layer.msg('请输入提现金额',{icon: 2});         return false;       }         //判断用户输入的提现金额是否大于等于500       if(money_request<500){         layer.msg('提现金额需要大于等于500哦', {           // time: 20000, //20s后自动关闭           btn: ['明白了', '知道了']         });         return false;       }         //判断用户的提现金额是否大于拥有的金额       //从后台取出该用户拥有多少余额       //这里假设是950       if(money_request>950){         layer.msg('提现金额不能大于您的余额哦',{icon: 5});         return false;       }       });     });   

上述就是小编为大家分享的怎么在layui中利用layer组件实现一个弹出层了,如果刚好有类似的疑惑,不妨参照上述分析进行理解。如果想知道更多相关知识,欢迎关注创新互联成都网站设计公司行业资讯频道。

另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


网站名称:怎么在layui中利用layer组件实现一个弹出层-创新互联
本文网址:http://www.cdkjz.cn/article/dicpos.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220