189 8069 5689

怎么在layui中利用layer组件实现一个弹出层

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

创新互联是一家专注于网站制作、成都网站制作与策划设计,文峰网站建设哪家好?创新互联做网站,专注于网站建设十年,网设计领域的专业建站公司;建站业务涵盖:文峰等地区。文峰做网站价格咨询:18982081108

代码实现:




  
  弹出层
  
  


申请提现

 


 
  $('#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组件实现一个弹出层了,如果刚好有类似的疑惑,不妨参照上述分析进行理解。如果想知道更多相关知识,欢迎关注创新互联行业资讯频道。


分享文章:怎么在layui中利用layer组件实现一个弹出层
网站网址:http://cdxtjz.cn/article/ipjchp.html

联系我们

您好HELLO!
感谢您来到成都网站建设公司,若您有合作意向,请您为我们留言或使用以下方式联系我们, 我们将尽快给你回复,并为您提供真诚的设计服务,谢谢。
  • 电话:028- 86922220 18980695689
  • 商务合作邮箱:631063699@qq.com
  • 合作QQ: 532337155
  • 成都网站设计地址:成都市青羊区锣锅巷31号五金站写字楼6楼

小谭建站工作室

成都小谭网站建设公司拥有多年以上互联网从业经验的团队,始终保持务实的风格,以"帮助客户成功"为已任,专注于提供对客户有价值的服务。 我们已为众企业及上市公司提供专业的网站建设服务。我们不只是一家网站建设的网络公司;我们对营销、技术、管理都有自己独特见解,小谭建站采取“创意+综合+营销”一体化的方式为您提供更专业的服务!

小谭观点

相对传统的成都网站建设公司而言,小谭是互联网中的网站品牌策划,我们精于企业品牌与互联网相结合的整体战略服务。
我们始终认为,网站必须注入企业基因,真正使网站成为企业vi的一部分,让整个网站品牌策划体系变的深入而持久。