Maison  >  Article  >  Applet WeChat  >  L'applet WeChat implémente simplement le formulaire pour obtenir le partage d'exemples de données d'entrée

L'applet WeChat implémente simplement le formulaire pour obtenir le partage d'exemples de données d'entrée

小云云
小云云original
2018-05-21 11:20:037122parcourir

Cet article présente principalement l'applet WeChat pour implémenter simplement le formulaire pour obtenir des données d'entrée, et implique la liaison d'événements de l'applet WeChat et l'acquisition de données pour le formulaire et d'autres techniques d'exploitation associées. Les amis qui en ont besoin peuvent s'y référer. J'espère que cela pourra aider tout le monde.

1. Affichage de l'effet

2. Code clé

index.wxml

<form bindsubmit="formBindsubmit" bindreset="formReset">
 <view style="display:flex;">
  <label>用户名:</label>
  <input name="userName" placeholder="请输入用户名!" />
 </view>
 <view style="display:flex;">
  <label>密码:</label>
  <input name="psw" placeholder="请输入密码!" password="true" />
 </view>
 <view style="display:flex;margin-top:30px;">
  <button style="width:30%;" formType="submit" >登录</button>
  <button style="width:30%" formType="reset" >重置</button>
 </view>
</form>
<view>{{tip}}</view>
<view>{{userName}}</view>
<view>{{psw}}</view>

index.js

Page({
 data:{
  // text:"这是一个页面"
  tip:&#39;&#39;,
  userName:&#39;&#39;,
  psw:&#39;&#39;
 },
 formBindsubmit:function(e){
  if(e.detail.value.userName.length==0||e.detail.value.psw.length==0){
   this.setData({
    tip:&#39;提示:用户名和密码不能为空!&#39;,
    userName:&#39;&#39;,
    psw:&#39;&#39;
   })
  }else{
   this.setData({
    tip:&#39;&#39;,
    userName:&#39;用户名:&#39;+e.detail.value.userName,
    psw:&#39;密码:&#39;+e.detail.value.psw
   })
  }
 },
 formReset:function(){
  this.setData({
   tip:&#39;&#39;,
   userName:&#39;&#39;,
   psw:&#39;&#39;
  })
 }
})

Recommandations associées :

Notes sur la sérialisation des formulaires jquery

Explication détaillée de la méthode Ajax pour implémenter la soumission de formulaire Form et précautions

Explication détaillée de la façon d'empêcher la page de sauter lors de la soumission d'un formulaire en HTML

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn