layer 弹出层 示例

• Layui（谐音：类UI) 是一款采用自身模块规范编写的前端 UI 框架，遵循原生 HTML/CSS/JS 的书写与组织形式，门槛极低，拿来即用

• 

• 示例

<script >
        $('.table').on('click','.edit ',function(){
           saveID = $(this).parent().parent().attr('data-id');
        });

        $(document).on('click', '.edit', function() {
           layui.use(['layer', 'form'], function(){
              var layer = layui.layer
              ,form = layui.form;
              layer.open({
                  skin: 'demo-class',
                  btn:['确定修改', '残忍拒绝'],                
                  title: ['请修改沟通状态', 'font-size:18px;'],
                  area:['400px','330px'],
                  content:'  <div class="modal-body "><div class="form-group"><label class="form_text_ipt">填写备注信息<small class="text-red">*</small></label><input value="" id="name_value" required="required" placeholder="如：王女士"  type="text" class="form-control" name="name" autocomplete="off" maxlength="80"></div> <div class="form-group"> <label>请修改状态   <small class="text-red">*</small> </label><select class="form-control form_text_ipt text-navy text-green" id="select"><option>已沟通过</option><option>暂未沟通</option></select></div></div>',
                  anim: 1,
                  btn1:function(index, layero){ 
                     var name_value = $("#name_value").val();
                     var options = $("#select option:selected");
                     var status = options.val();
                     console.log(options.val(),111,name_value);
                         $.ajax({
                           type: "POST",
                           url: "/scratch/edit",
                           dataType:"json",
                           data:{
                              "saveID" :saveID,
                              "status":status,
                              "name_value":name_value,
                               "_token":"{{ csrf_token() }}",
                           },
                            success: function(data) {
                              if (data.code == 200) {
                              window.location.href="{{ url('scratch/list') }}";

                              }
                            }
                        });               
                  },
                  btn2:function(index, layero){ 
                        layer.closeAll();
                  },       

                });  
            });
        });
   <script > 

• 下载引用，具体参数参照官方文档

http://www.layui.com/doc/