<div class="layui-form-item">
<label class="layui-form-label">輸入框</label>
<div class="layui-input-block">
<input type="text" name="title" required lay-verify="required" placeholder="請輸入標題" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密碼框</label>
<div class="layui-input-inline">
<input type="password" name="password" required lay-verify="required" placeholder="請輸入密碼" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">輔助文字</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">選擇框</label>
<div class="layui-input-block">
<select name="city" lay-verify="required">
<option value=""></option>
<option value="0">北京</option>
<option value="1">上海</option>
<option value="2">廣州</option>
<option value="3">深圳</option>
<option value="4">杭州</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">復選框</label>
<div class="layui-input-block">
<input type="checkbox" name="like[write]" title="寫作">
<input type="checkbox" name="like[read]" title="閱讀" checked>
<input type="checkbox" name="like[dai]" title="發呆">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">開關</label>
<div class="layui-input-block">
<input type="checkbox" name="switch" lay-skin="switch">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">單選框</label>
<div class="layui-input-block">
<input type="radio" name="sex" value="男" title="男">
<input type="radio" name="sex" value="女" title="女" checked>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">文本域</label>
<div class="layui-input-block">
<textarea name="desc" placeholder="請輸入內容" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
<script>
//Demo
layui.use('form', function(){
var form = layui.form;
//監聽提交
form.on('submit(formDemo)', function(data){
layer.msg(JSON.stringify(data.field));
return false;
});
});
</script>
<select name="quiz">
<option value="">請選擇</option>
<optgroup label="城市記憶">
<option value="妳工作的第壹個城市">妳工作的第壹個城市?</option>
</optgroup>
<optgroup label="學生時代">
<option value="妳的工號">妳的工號?</option>
<option value="妳最喜歡的老師">妳最喜歡的老師?</option>
</optgroup>
</select>
<select name="city" lay-verify="" lay-search>
<option value="010">layer</option>
<option value="021">form</option>
<option value="0571" selected>layim</option>
……
</select>
默認風格:
<input type="checkbox" name="" title="寫作" checked>
<input type="checkbox" name="" title="發呆">
<input type="checkbox" name="" title="禁用" disabled>
原始風格:
<input type="checkbox" name="" title="寫作" lay-skin="primary" checked>
<input type="checkbox" name="" title="發呆" lay-skin="primary">
<input type="checkbox" name="" title="禁用" lay-skin="primary" disabled>
<input type="checkbox" name="xxx" lay-skin="switch">
<input type="checkbox" name="yyy" lay-skin="switch" lay-text="ON|OFF" checked>
<input type="checkbox" name="zzz" lay-skin="switch" lay-text="開啟|關閉">
<input type="checkbox" name="aaa" lay-skin="switch" disabled>
<input type="radio" name="sex" value="nan" title="男">
<input type="radio" name="sex" value="nv" title="女" checked>
<input type="radio" name="sex" value="" title="中性" disabled>
<textarea name="" required lay-verify="required" placeholder="請輸入" class="layui-textarea"></textarea>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">範圍</label>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" name="price_min" placeholder="¥" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid">-</div>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" name="price_max" placeholder="¥" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">密碼</label>
<div class="layui-input-inline" style="width: 100px;">
<input type="password" name="" autocomplete="off" class="layui-input">
</div>
</div>
</div>