本文摘自PHP中文网,作者尚,侵删。

一、普通输入框 input

1 2 3 4 5 6 7 | <div class= "layui-form-item" >
<label class= "layui-form-label" ><span class= "f_orange" >*</span>字段编号</label>
<div class= "layui-input-block width_250 pos-r" >
<input type= "text" class= "layui-input" name= "ColumnCode" lay-verify= "required|inputLength_100" placeholder= "" autocomplete= "off" >
<i class= "icon_ca_layui" ></i>
</div>
</div>
|
二、自动完成式输入框
1、确保 layui 引入了 autoComplete 插件。
2、确保初始化代码运行于 layui.use 的回调函数里。
3、引入 baseUtility.js。

HTML
1 2 3 4 5 6 7 8 9 | @* 备案网点 *@
<div class= "layui-input-block" style= "margin-top:5px; margin-left:320px;" >
<label class= "layui-form-label" >备案网点</label>
<div class= "layui-input-inline" >
<input type= "text" id= "txtRegisterCompanyId_searchForm" lay-verify= "required" style= "width:200px;"
placeholder= "请输入" data-provide= "typeahead" class= "layui-input" autocomplete= "off" >
<input type= "hidden" name= "RegisterCompanyId" id= "hiddenRegisterCompanyId_searchForm" />
</div>
</div>
|
js 数据源初始化
需定义在 layui.use 的回调函数中。
1 2 | siteUtility.GetAllSiteByKey( "#txtRegisterCompanyId_searchForm" , "#hiddenRegisterCompanyId_searchForm" );
|
一个是输入框的 id, 一个是隐藏域的 id。
该 GetAllSiteByKey 公共函数已定义在 baseUtility.js 中。
获取其值
1 2 | var serializeForm = $( "#searchForm" ).formSerialize( true );
|
该序列化方法可以获取隐藏域的 id 值。
阅读剩余部分
相关阅读 >>
浅谈layui前端遇到的难点(集合)
layui的本地存储方法介绍
layui后端怎么搭建
layui-inline的作用是什么
让layui支持wangeditor编辑器的方法
一些layui底层方法介绍
layui.js 如何声明全局变量
layui列表怎么取input框的值
jquery的easyui和layui区别是什么
layui的tips层怎么用
更多相关阅读请进入《layui》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » layui框架常用输入框介绍