微信小程序（组件--表单：交互控件）

最新推荐文章于 2024-09-21 16:46:41 发布

原创

最新推荐文章于 2024-09-21 16:46:41 发布

· 258 阅读

1 ·

版权

本文详细介绍了微信小程序中的input输入框组件，包括基础属性如type、placeholder和焦点类属性，以及confirm-type在不同场景的应用。同时，提到了textarea组件在发表评论等场景的使用，以及form表单组件的提交、重置操作，强调了name属性的重要性。此外，还讨论了表单组件的验证、实时字数监控以及label和checkbox-group组件的用法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

input输入框
基础属性：

input输入框组件–基础属性—type类型

type属性值

text：文本输入键盘

number：数字输入键盘

idcard：身份证输入键盘

digit：带小数点的数字键盘

input输入框组件—占位符placeholder相关
占位符placeholder属性：

案例：

<input placeholder="请输入内容" placeholder-style="color:#ff5857;"></input>

注意： placeholder字体大小默认与input字体大小相同，不能分开设置，不然应用户体验。方案：给input设置字体大小即可

 <input placeholder="请输入内容" placeholder-class="placeClass"></input>

.placeClass{
  color: #2d78f4;
}

请输入内容
input输入框组件—焦点类属性：

案例：（focus）

<input placeholder="请输入内容" value="默认初始值" bindfocus="focusFn"></input>

focusFn(option){
    console.log(option)
  },

案例：（blur）

<input placeholder="请输入内容" value="默认初始值" bindfocus="focusFn" bindblur="blurFn"></input>

blurFn(option){
    console.log(option)
  },

input输入框组件—键盘与键盘按钮

最低0.47元/天解锁文章