微信小程序-form表单-获取用户输入文本框的值

news2024/11/28 12:40:57

微信小程序-form表单-获取用户输入文本框的值

data: {
    userName: '',
    userPwd:""
  },

//获取用户输入的用户名
userNameInput:function(e)
{
  this.setData({
    userName: e.detail.value
  })
},
passWdInput:function(e)
{
  this.setData({
    userPwd: e.detail.value
  })
},
//获取用户输入的密码
loginBtnClick: function (e) {
  console.log("用户名:"+this.data.userName+" 密码:" +this.data.password);
},

<!--pages/login/login3.wxml-->
<input class="input" name="userName" placeholder="请输入用户名"
    bindinput ="userNameInput"/>
 
<input class="input" name="password" placeholder="请输入密码"
     bindinput="passWdInput" />
 
<button class="loginBtn" bindtap="loginBtnClick">登录</button>

//登录函数
toLogin(e){
  //获取提交的用户名和密码用变量存储
  var userName=e.detail.value.userName;
  var userPwd=e.detail.value.userPwd;
  console.log("要提交给服务器的用户名和密码是",userName,userPwd);
},
<!--定义form组件-->
<form bindsubmit="toLogin">
    <!--输入框区块-->
    <view id="inputView">
        <!--文本框-->
        <input type="text" placeholder="手机号/用户名" name="userName"></input>
        <!--密码框-->
        <input type="text" placeholder="密码" password name="userPwd"></input>
    </view>
    <!--按钮区域-->
    <view id="buttonView">
        <button form-type="submit">登录</button>
        <button>注册</button>
        <view>忘记密码</view>
    </view>
</form>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1166482.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Nacos本地修改编译源码2.2.3

下载Nacos源码 由于github访问速度慢&#xff0c;所以在gitee上下载 git clone https://gitee.com/mirrors/Nacos.git切换2.2.3版本 git checkout 2.2.3或者直接下载2.2.3的源码 本地编译 源码导入idea&#xff0c;然后编译 mvn -Dmaven.test.skiptrue -Drat.skiptrue c…

电力/税务单位宣传稿考核,投稿报纸怎么做

在当今信息传播的多元化时代&#xff0c;纸质媒体仍然是企业、机关事业单位宣传的重要平台。不管的本地报纸&#xff0c;还是省级报纸或国家级报纸、网媒&#xff0c;可能都有考核要求。 要在报纸上发表文稿&#xff0c;一般需要以下步骤&#xff1a; 1、选择合适的报纸&#x…

用斐波那契分解正整数

https://vjudge.net/contest/591700#problem/C 观察这个形式&#xff0c;如果交替做&#xff0c;就是个斐波那契数列 打表可得&#xff0c;任何正整数都可以大约由 log ⁡ \log log 个斐波那契数加起来 然后直接拼斐波那契数即可 #include<bits/stdc.h> using namesp…

REF615C-D HCFFAEAGABC2BAA1XD 一体化工业解决方案

REF615C-D HCFFAEAGABC2BAA1XD 一体化工业解决方案 Crimson Control使客户能够使用IEC 61131编程语言——如梯形逻辑、功能块、结构化文本和指令列表——通过开发类似可编程逻辑控制器(PLC)或远程遥测单元(RTU)的逻辑控制来解决特定的应用需求&#xff0c;而无需额外的费用。该…

TikTok小企业营销:崭露头角的新机遇

在数字时代&#xff0c;社交媒体已经成为推广和营销的强大工具。其中&#xff0c;TikTok以其独特的短视频内容和庞大的用户基础&#xff0c;为小企业提供了前所未有的营销机会。本文将深入探讨TikTok小企业的崛起&#xff0c;以及它所带来的新机会和挑战。 TikTok&#xff1a;数…

新建Git仓库后!如何将本地项目直接推送上到git仓库中的详细教程!

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、Git新建仓库二、来到你的本地仓库 前言 我们在git新建仓库后&#xff0c;如何直接在本地的项目文件夹中直接推送到git仓库中呢&#xff01;那么下面是详细…

QT6/5无痛安装和扩展,新手专用

QT6安装教程 注意在QT5.14.2以后版本只支持在线安装&#xff0c;所以如果需要离线exe版本&#xff0c;请安装5.14.2版本。这里是基于6.5版本Windows10的安装 如果觉得有用的话&#xff0c;请给个点赞收藏 1、安装链接 官方链接 qt官方链接&#xff1a;https://download.qt.io…

Angular异步数据流编程

1 目前常见的异步编程的几种方法 首先给出一个异步请求的实例&#xff1a; import {Injectable} from angular/core;Injectable({providedIn: root }) export class RequestServiceService {constructor() {}getData() {setTimeout(() > {let res zhaoshuai-lcreturn res…

uniapp写一个计算器用于记账(微信小程序,APP)

提要&#xff1a;自己用uniapp写了一个记账小程序&#xff08;目前是小程序&#xff09;&#xff0c;写到计算器部分&#xff0c;在网上找了别人写的计算器&#xff0c;大多数逻辑都是最简单的&#xff0c;都不能满足一个记账计算器的基本逻辑。与其在网上找来找去&#xff0c;…

Okta 数据泄露暴露了员工的个人信息

Okta 警告近 5000 名员工&#xff0c;他们的个人信息在第三方供应商遭到破坏后泄露。 Okta 是一家位于旧金山的云身份和访问管理解决方案提供商&#xff0c;其单点登录 (SSO)、多重身份验证 (MFA) 和 API 访问管理服务被全球数千个组织使用。 该 数据泄露通知 警告称&#xf…

PS学习笔记合集

2.一些快捷键 一、放大快捷键 Ctrl&#xff1a;在画布中点击一次&#xff0c;即可放大一次&#xff0c;可多次点击。 CtrlShift&#xff1a;在画布中点击一次&#xff0c;即可放大到适合窗口大小。 CtrlAlt&#xff1a;在画布中点击一次&#xff0c;即可放大到适合窗口大小&a…

Leetcode刷题详解——二叉树的所有路径

1. 题目链接&#xff1a;257. 二叉树的所有路径 2. 题目描述&#xff1a; 给你一个二叉树的根节点 root &#xff0c;按 任意顺序 &#xff0c;返回所有从根节点到叶子节点的路径。 叶子节点 是指没有子节点的节点。 示例 1&#xff1a; 输入&#xff1a;root [1,2,3,null,5]…

电器展示预约小程序的效果

大小电器是人们生活中必备的&#xff0c;电商经济条件下&#xff0c;很多消费者往往会通过线上购买电器&#xff0c;使得线下商家经营困难&#xff0c;但实体店依然有存在的意义&#xff0c;比如一些大件或精细电器&#xff0c;也需要亲自挑选、本地配送等。 对实体店商家来说…

云上智能驾驶三维重建优秀实践

本文重点介绍火山引擎多媒体实验室三维重建技术在动态、静态场景的以及结合先进光场重建技术的原理与实践&#xff0c;帮助大家能更好的了解和认识云上智能三维重建如何服务智能驾驶领域&#xff0c;助力行业发展。 智能驾驶技术的不断发展&#xff0c;正在改变着我们的出行方式…

【深入探究人工智能】历史、应用、技术与未来

深入探究人工智能 前言人工智能的历史人工智能的应用人工智能的技术人工智能的未来当代的人工智能产物结语&#x1f340;小结&#x1f340; &#x1f389;博客主页&#xff1a;小智_x0___0x_ &#x1f389;欢迎关注&#xff1a;&#x1f44d;点赞&#x1f64c;收藏✍️留言 &am…

第二十一章 模板

一、模板 1、模板的概念 模板就是建立通用的模具&#xff0c;大大提高复用性 例如生活中的模板 一寸照片模板&#xff1a; PPT模板&#xff1a; 模板的特点&#xff1a; 模板不可以直接使用&#xff0c;它只是一个框架 模板的通用并不是万能的 2、函数模板 C另一种编程思…

定时器和Timer

♫什么是定时器 定时器是一种计时设备&#xff0c;通过定时器可以让某段代码达到设定的时间后再执行。定时器是一个常用的组件&#xff0c;如在进行网络编程时就常用定时器来定时重发数据包、定时检测网络连接状态、定时更新缓存等操作。 ♫实现一个定时器 定时器需要有一个优先…

chat2db初步使用和体验AI

今天下载chat2db体验了下将主要功能和使用截图总结下&#xff1a; 功能&#xff1a; 1.传统客户端能使用的功能基本都有&#xff0c;并且增加了导出excel等便捷的能力。 2.报表功能&#xff1a; 可以根据查询结果进行对应报表可视化显示 3.AI解析sql 可以根据输入的汉语例如…

比如我的企业也想要申报抖音白名单进行直播招聘,该如何操作呢?

比如现在我的企业也想要申报抖音白名单进行直播招聘&#xff0c;该如何申报呢&#xff1f; 答&#xff1a;相关企业/商家在提供自身相关的招聘资质后&#xff0c;就可以进行抖音直播报白名单的申请&#xff0c;在审核通过之后就可以百分百的在抖音直播时畅聊关于自家企业的招聘…

全志XR806基于FreeRTOS的SoftAp配网实现

1.环境搭建 由于电脑上之前就有开发其他设备用的ubuntu18.06虚拟机环境&#xff0c;就在此环境基础上进行开发。基本环境搭建参考官方文档进行&#xff1a; 全志XR806开发板开发环境搭建 2.功能实现 2.1设计思路 从官方下载的SDK开发包project/example目录下有基本功能实现…