zoukankan      html  css  js  c++  java
  • 微信小程序组件form

    表单组件form:官方文档

    Demo Code:

    Page({
      formSubmit: function(e) {
        console.log('form发生了submit事件,携带数据为:', e.detail.value)
      },
      formReset: function() {
        console.log('form发生了reset事件')
      }
    })
    JS
    <form bindsubmit="formSubmit" bindreset="formReset">
      <view class="section section_gap">
        <view class="section__title">switch</view>
        <switch name="switch"/>
      </view>
      <view class="section section_gap">
        <view class="section__title">slider</view>
        <slider name="slider" show-value ></slider>
      </view>
    
      <view class="section">
        <view class="section__title">input</view>
        <input name="input" placeholder="please input here" />
      </view>
      <view class="section section_gap">
        <view class="section__title">radio</view>
        <radio-group name="radio-group">
          <label class="checkbox"><radio value="radio1"/>radio1</label>
          <label class="checkbox"><radio value="radio2"/>radio2</label>
        </radio-group>
      </view>
      <view class="section section_gap">
        <view class="section__title">checkbox</view>
        <checkbox-group name="checkbox">
          <label class="checkbox"><checkbox value="checkbox1"/>checkbox1</label>
          <label class="checkbox"><checkbox value="checkbox2"/>checkbox2</label>
        </checkbox-group>
      </view>
      <view class="btn-area">
        <button formType="submit">Submit</button>
        <button formType="reset">Reset</button>
      </view>
    </form>
    WXML
    .section__title{
        font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        padding:5px;
    }
    label{
        font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }
    .section_gap{
        margin-top: 10px;
    }
    .checkbox{
        display:block;
        margin-left:10px;
        margin-top:5px;
    }
    WXSS
  • 相关阅读:
    LeetCode59 Spiral Matrix II
    LeetCode58 Length of Last Word
    LeetCode54 Spiral Matrix
    LeetCode63 Unique Paths II
    LeetCode62 Unique Paths
    LeetCode55 Jump Game
    网易2017年校招笔试题 最大的奇约数
    Codeforces Round #119 (Div. 2)
    Codeforces Round #118 (Div. 2)
    2016 MIPT Pre-Finals Workshop Taiwan NTU Contest
  • 原文地址:https://www.cnblogs.com/betterlife/p/5969060.html
Copyright © 2011-2022 走看看