在微信小程序的开发中，input是用来输入文字的，比如用户名和密码。
1基本用途
<input class="input" name="userName" placeholder="请输入用户名" auto-focus="true" />
基本效果是显示一个文本输入框。
placeholder 输入框为空时的占位符auto-focus 自动聚集，拉起键盘，需要注意的是一个页面中只能有一个 input 标签 或者 textarea 来设置这个属性
2获取输入框的内容。
Bindinput属性用于绑定键盘输入时的事件监控，即可以实时获取输入中的内容。
当然，您可以在您的处理函数中直接返回一个结果来替换输入框中的内容。
<input bindinput="userNameInputAction" class="input" name="userName" placeholder="请输入用户名" auto-focus="true" />
相应的js
/** * 输入框实时回调 * @param {*} options */ userNameInputAction: function (options) { //获取输入框输入的内容 let value = options.detail.value; console.log("输入框输入的内容是 " + value) },
在微信小程序的开发中，input是用来输入文字的，比如用户名和密码。
1基本用途
<input?class="input"?name="userName"?placeholder="请输入用户名"?auto-focus="true"?/>
基本效果是显示一个文本输入框。
placeholder 输入框为空时的占位符auto-focus 自动聚集，拉起键盘，需要注意的是一个页面中只能有一个 input 标签 或者 textarea 来设置这个属性
2获取输入框的内容。
Bindinput属性用于绑定键盘输入时的事件监控，即可以实时获取输入中的内容。
当然，您可以在您的处理函数中直接返回一个结果来替换输入框中的内容。
??<input?bindinput="userNameInputAction"??class="input"?name="userName"?placeholder="请输入用户名"?auto-focus="true"?/>
相应的js
/** * 输入框实时回调 * @param {*} options */ userNameInputAction: function (options) { //获取输入框输入的内容 let value = options.detail.value; console.log("输入框输入的内容是 " + value) },
影响
3输入框焦点监控
有很多应用场景，比如输入结束检查数据。
bindfocu***indblur 输入框焦点移出bindconfirm 点击键盘的回车键或者是完成按钮时回调的事件 <input bindfocus="userNameFocusAction" bindblur="userNameBlurAction" bindconfirm="userNameConfirm" placeholder="请输入用户名" />
相应的js
userNameFocusAction: function (options) { //输入框焦点获取 let value = options.detail.value; console.log("输入框焦点获取 " + value) }, userNameBlurAction: function (options) { //输入框焦点移出 let value = options.detail.value; console.log("输入框焦点移出 " + value) }, userNameConfirm: function (options) { //点击了键盘上的完成按钮 let value = options.detail.value; console.log("点击了键盘上的完成按钮 " + value) },
翻译
4常见输入限制
disabled 默认为false 不禁用输入框，为true时是不可输入的<input disabled="{{isInput}}" placeholder="请输入用户名" />Page({ /** * 页面的初始数据 */ data: { isInput:true },})
默认情况下，密码为假；为真时，输入内容为密码类型。
<input password="true" placeholder="请输入用户名" />
5型文本框输入内容格式
在HTML中，输入组件中的type属性可以接收哪些值，比如按钮、文本、单选、复选框、隐藏、图像、重置、提交等。在微信小程序中，类型属性只有文字、数字、id卡、数字、时间和日期。
本文来自无言温柔天然对象投稿，不代表舒华文档立场，如若转载，请注明出处：https://www.chinashuhua.cn/24/596308.html
微信扫一扫 
