layer的弹出层提交表单

以下是使用layer弹出层提交表单的示例代码：

<!-- 引入layer和jQuery库 -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.js"></script>

<!-- HTML表单 -->
<form class="layui-form" action="">
  <div class="layui-form-item">
    <label class="layui-form-label">角色名</label>
    <div class="layui-input-block">
      <input type="text" name="rolename" required lay-verify="required" placeholder="请输入角色名" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit lay-filter="formDemo">提交</button>
    </div>
  </div>
</form>

<!-- JavaScript代码 -->
<script>
// 监听表单提交事件
layui.form.on('submit(formDemo)', function(data){
  // 使用ajax提交表单数据
  $.ajax({
    url: data.form.action,
    type: 'POST',
    data: data.field,
    success: function(res){
      // 弹出提交成功提示框
      layer.msg('提交成功');
    },
    error: function(){
      // 弹出提交失败提示框
      layer.msg('提交失败');
    }
  });
  return false; // 阻止表单跳转
});
</script>