Skip to content

TextBox(文本框)

扩展自$.fn.iValidatebox.defaults,使用$.fn.iTextbox.defaults重写默认值对象。

TextBox(文本框)是一个增强的输入字段组件, 它允许用户非常简单的创建一组表单。它是一个用于构建其他组合控件的基础组件,如:combo,databox、spinner等

依赖关系

用法

通过标签创建文本框。

html
<input data-toggle="topjui-textbox" data-options="width:300,iconCls:'icon-search'">

使用Javascript创建文本框。

html
<input id="tb" type="text">
javascript
$('#tb').iTextbox({
    width:300,
    buttonText:'Search',
    iconCls:'icon-man',
    iconAlign:'left'
})

属性

属性名属性值类型描述默认值
widthnumber组件的宽度。auto
heightnumber组件的高度。22
clsstring允许给组件添加一个自定义css类名。22
promptstring在输入框显示提示消息。''
valuestring默认值
typestring文本框类型。可用值有:"text"和"password"。text
labelstring,selector文本框标签。null
labelWidthnumber标签宽度。auto
labelPositionstring标签位置。可用值:'before','after','top'before
labelAlignstring标签对齐方式。可用值:'left','right'left
multilineboolean定义是否是多行文本框。FALSE
editableboolean定义用户是否可以直接在该字段内输入文字。TRUE
disabledboolean定义是否禁用该字段。FALSE
readonlyboolean定义是否将该控件设为只读。FALSE
iconsarray在文本框删贡献是图标。每一项都有以下属性:iconCls:类型string,图标的class名称;disabled:类型boolean,指明是否禁用该图标;handler:类型function,用于处理点击该图标以后的动作。[]
iconClsstring在文本框显示背景图标。null
iconAlignstring背景图标的位置。可用值有:"left", "right"。right
iconWidthnumber图标宽度。18
buttonTextstring文本框附加按钮显示的文本内容。
buttonIconstring文本框附加按钮显示的图标。null
buttonAlignstring附加按钮的位置。可用值有:"left", "right"。right

事件

事件扩展自validatebox,以下是新增的文本框事件。

事件名事件参数描述
onChangenewValue, oldValue在字段值更改的时候触发。
onResizewidth, height在文本框大小改变的时候触发。
onClickButtonnone在用户点击按钮的时候触发。
onClickIconindex在用户点击图标的时候触发。

方法

方法扩展自validatebox,以下是新增的文本框方法。

方法名方法参数描述
optionsnone返回属性对象。
textboxnone返回文本框对象。
buttonnone返回按钮对象。
destroynone销毁文本框组件。
resizewidth调整文本框组件宽度。
disablenone禁用组件。
enablenone启用组件。
readonlymode启用/禁用只读模式。见下方代码示例。
clearnone清除组件中的值。
resetnone重置组件中的值。
initValuevalue初始化组件值。调用该方法不会触发"onChange"事件。
setTexttext设置显示的文本值。
getTextnone获取显示的文本值。
setValuevalue设置组件的值。
getValuenone获取组件的值。
getIconindex获取指定图标对象。

方法代码示例

readonly方法示例:

javascript
$('#tb').iTextbox('readonly');      // 启用只读模式
$('#tb').iTextbox('readonly',true); // 启用只读模式
$('#tb').iTextbox('readonly',false);    // 禁用只读模式

基于最新稳定版jQuery EasyUI构建的前端框架