调用：Input 背景：bg3.jpg

image.png
image.png

⚙ 配置

属性 说明 是否必需
kbType 键盘类型 YES
minLen 最小输入长度（校验时生效） NO
maxLen 最大输入长度 NO
placeholder 输入框中默认显示信息 NO
tip 输入框上部示信息 NO
media 左侧媒体信息配置
资源路径：./h5/img/icon/qrcode/（文件名不可随意定义）		 YES
password 是否以密码形式输入 NO
onEnter 键入回车事件 NO
clear 是否显示清空按钮 “yes|no” NO

整体配置范例

  1. function Input() {
  2.   var data = {
  3.     model: "Input",
  4.     config: {
  5.       shell: commonShellCfg2,
  6.       bgImg: "bg3.jpg",
  7.       media: {
  8.         type: "pic", //swf pic qrcode
  9.         url: "./h5/img/lefttip/input.png",
  10.         // size: 220,
  11.         data: "guoguang-geit",
  12.         qrIcon: "ali"
  13.       },
  14.       /**
  15.         * 1. digital 数字
  16.         * 2. phone   手机号(具备格式化功能)
  17.         * 3. identy  身份证
  18.         * 4. money   金额输入
  19.         */
  20.       kbType: 'money',
  21.       placeholder:"输入",
  22.       minLen: 1,
  23.       maxLen: 26,
  24.       tip: "请输入预缴金额",
  25.       getData: 'InputIdenty_data',
  26.       password: false,
  27.       onEnter: "onEnter",
  28.       clear:"no",
  29.     }
  30.   }
  31.   return data
  32. }

kbType

  1. /**
  2.     * 1. digital 数字
  3.   * 2. phone   手机号(具备格式化功能)
  4.   * 3. identy  身份证
  5.   * 4. money   金额输入
  6.   */
  7. kbType: 'digital'

maxLen

  1. // 最大输入长度
  2. maxLen: 11,

tip

  1. tip: "提示信息",

media

  1. //当type为pic或swf时           
  2. media:{
  3.    //媒体类型：swf|pic（可以是gif文件）|qrcode
  4.    type:"swf",//swf pic qrcode
  5.    //媒体文件路径
  6.    url:"./h5/swf/idc.swf",
  7.    //媒体文件尺寸（非必要，默认是文件原件尺寸大小）
  8.    //🔆为了不影响缩放比例,只调width或height一个值
  9.    size:{
  10.       width:"200px",
  11.       height:"100px"
  12.    },
  13. }
  15. //当type为qrcode时
  16. media:{
  17.    //媒体类型
  18.    type:"qrcode",
  19.    //二维码大小
  20.    //🔆为正方形,可不配置,默认220（1024*768），280（1280*1024）
  21.    size:220,
  22.    //二维码数据
  23.    data:"123",
  24.    //二维码中ICON  
  25.    //微信:wx；支付宝:ali
  26.    qrIcon:"ali"
  27. }

placeholder

  1. // 输入框中默认显示信息
  2. placeholder:"输入",

password

  1. // boolean ? 密码形式 : 明文
  2. password: false,

clear

  1. // 是否显示清空按钮 yes|no 
  2. clear:"yes",

onEnter

  1. onEnter: "onEnter"
  3. function onEnter(){
  4.   console.log("你敲了回车键")
  5. }

♨️ JS Call

window.ZZH5.Call.setData(‘+’);

仅供Pinpad使用，只接受三种值。


window.ZZH5.Call.setInputValue(‘Test Value’);

可以传入任意字符串，全量更新输入框内的值。

window.ZZH5.Call.verify(type, msg);

type：”minlen” | “idc” | “mobile” msg：校验不通过时提示的文本内容 根据type校验输入框的值，分别为最小位数，是否符合身份证格式，是否符合手机号格式，校验通过返回true，不通过则返回false。

🚀 getData

  1. var ret=ZZH5.Call.getData();