微信小程序开发初学：输入框 - input

输入框。

input具有的属性

value
类型：String
默认值：无
输入框内的初始内容

type
类型：String
默认值：text
输入内容的类型

type属性的合法值
（1）text：输入文本
（2）number：输入数字（弹出数字键盘）
（3）idcard：输入身份证（弹出身份证输入键盘）

password
类型：boolean
默认值：false
是否为密码类型（输入内容显示为圆点）

placeholder
类型：String
默认值：无
提示词

placeholder-class
类型：String
默认值：input-placeholder
placeholder的 样式类

disabled
类型：boolean
默认值：false
input禁用

maxlength
类型：number
默认值：-1
最大输入长度，设置为 -1 的时候不限制最大长度

foucs
类型：boolean
默认值：false
自动聚焦，拉起键盘

cursor-spacing
类型：number
默认值：0
指定光标与键盘的距离

confirm-type
类型：String
默认值：done
设置键盘右下角按钮的文字，仅在 type=“text” 时生效

confirm-type属性的合法值
（1）done：文字为“完成”
（2）search：文字为“搜索”
（3）send：文字为“发送”
（4）next：文字为“下一个”
（5）go：文字为“前往”

示例：

<view class="input-view">
   <form bindsubmit="onSubmit">
      <input class="input1" type="text" >input>
      <input class="input1" type="number">input>
      <input class="input1" type="idcard">input>

      <input class="input1" type="text" password>input>
      
      <input class="input1" type="text"  value="设置了初始值value">input>

      <input class="input1" 
      placeholder="请输入用户名" placeholder-class="input1-place">
      input>
      

      <input class="input1" disabled>input>
      

      <input class="input1" type="idcard" maxlength="18">input>
      

      <input class="input1" foucs>input>
      <input class="input1" foucs cursor-spacing="10px">input>
      

      <input class="input1" focus confirm-type="search">input>
      

      <button class="btn1" type="primary" form-type="submit">提交button>
      
   form>
view>

/* pages/input/input.wxss */
.input1{
    height: 35px;
    border: 1px solid black; border-radius: 5px;
    /*设置边框及圆角*/
    margin-top: 10px;
}

.input1-place{
    /*placeholder样式类*/
    color: palevioletred;
    font-style: italic;
}

.btn1{
    margin-top: 20px;
}

内容参考自小程序API：
https://developers.weixin.qq.com/miniprogram/dev/component/input.html