下面是我使用中的 仅供参考

 {extend name="$member_style_layout" /}

{block name="content"}
<form id="regform">
  <style type="text/css">
.tjbtn {
    background: #FF4001;
    border-radius: 2px;
    width: 70px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: #fff;
    border: 0;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
}
</style>
  
  <!--这种是最常用的,表单没做分组显示的-->
  <table width="100%" border="0" cellspacing="0" cellpadding="0" class="FormTable">
    {if $tab_ext.area} 
    <!-- 这一段是地区选择 -->
    <tr id="form_group_area">
      <td class='tdL'>地区选择: </td>
      <td class="tdR layui-input-inline"><div class="ListArea">
          <select name='province_id' data-title="请选择省份" lay-ignore>
          </select>
          <select name='city_id' data-title="请选择城市" lay-ignore>
          </select>
          <select name='zone_id' data-title="请选择区域" lay-ignore>
          </select>
          <select name='street_id' data-title="请选择街道" lay-ignore>
          </select>
        </div></td>
    </tr>
    {/if} 
    <!-- 参数 field="pic,tit" 代表过滤哪些字段不显示出来 里边支持TP标签 --> 
    {qb:form field="" f_array="$f_array"}
    <tr id="form_group_{$rs.name}">
      <td class="tdL">{$rs.title}: </td>
      <td class="tdR layui-input-block"><div>{$rs.value}</div>
        {notempty name="$rs.about"}
        <div>{$rs.about}</div>
        {/notempty} </td>
    </tr>
    {/qb:form}
    <tr>
      <td class="tdL"><br/></td>
      <td class="tdR"><div class="tjbtn" onClick="regvip();">提交</div></td>
    </tr>
  </table>
</form>
<script type="text/javascript">
function tishi() {
	layer.msg('正在提交中... 请耐心等候');
	return false; 
}
 function regvip() {
	 $('.tjbtn').attr('onClick','tishi();');
    $.ajax({
        url: "{:request()->url(true)}",
        type: "POST",
        data: $('#regform').serialize(),
        success: function (info) {
            if (info.code === 1) {
				layer.open({content:info.msg,skin: 'msg',time: 3});
				 window.parent.layer.closeAll();
				window.parent.location.reload();
                 
            }else{
				
				layer.open({title: '提交失败',content:info.msg});
			}
			 
             
        }
    });
	 
    
}
</script> 

<!-- 表单常用事件,比如无刷新提交 --> 
<script LANGUAGE="JavaScript" src="__STATIC__/js/form/base.js"></script> 
<SCRIPT LANGUAGE="JavaScript">
//地区选择事件
{php}$info=getArray($info);{/php}
var default_ckid = ["{$info.province_id}","{$info.city_id}","{$info.zone_id}","{$info.street_id}"];
var get_area_url = "{:purl('area/api/getlist',[],'index')}";
</SCRIPT> 
<script type="text/javascript">
$(":input[name='province_id']").change(function() {
    $("#atc_address").val($(":input[name='province_id']").find("option:selected").text());
});
$(":input[name='city_id']").change(function() {
    $("#atc_address").val($(":input[name='address']").val() + $(":input[name='city_id']").find("option:selected").text());
});
$(":input[name='zone_id']").change(function() {
    $("#atc_address").val($(":input[name='address']").val() + $(":input[name='zone_id']").find("option:selected").text());
});
$(":input[name='street_id']").change(function() {
    $("#atc_address").val($(":input[name='address']").val() + $(":input[name='street_id']").find("option:selected").text());
});
</script> 
{/block}

添加这个文件里