input输入框的官方api文档:http://dev.dcloud.net.cn/mui/ui/#input

一、输入框类型

输入框的类型是根据type来决定是普通输入框还是密码框,搜索框等类型

  1. <label>帐号</label>
  2. <input id="mess" class="mui-input-clear" type="text" placeholder="请输入帐号">
  3. <label>密码</label>
  4. <input type="password" class="mui-input-clear" name="pass" placeholder="请输入密码" />

而id是可以用来获取该输入框,或者使用class来批量获取。

二、输入框内容获取

1、比如这个帐号输入框,可以使用id来获取内容

  1. document.getElementById("mess").value;

2、当然因为他是第一个,所以也可以使用document的方法来获取

  1. document.querySelector(".mui-input-clear").value

3、或者使用mui()加class来获取组,通过获得的array来获取

  1. mui("input.mui-input-clear")[0].value
  2. //或者下面这个方法
  3. mui(".mui-input-clear")[0].value

这个区别就是一个是获取的input的所有包含mui-input-clear类型的,一个是所有的mui-input-clear类型的,可以查看官方文档的mui()的说明

三、输入框内容操作

获取了输入框内容,这里最简单的就是模拟一个登录,按钮绑定一个函数

  1. <button type="button" class="mui-btn mui-btn-blue mui-btn-block" onclick="sss()">登录</button>

在button的sss方法中可以这么写

  1. <script type="text/javascript">
  2. function sss () {
  3. var m = mui(".mui-input-clear");
  4. var uncomplete = false;
  5. mui.each(m,function (index,item) {
  6. console.log(item.value);
  7. if (!item.value||item.value.trim() == "") {
  8. uncomplete = true;
  9. }
  10. });
  11. if (uncomplete) {
  12. mui.toast("请填写信息");
  13. } else{
  14. mui.toast("登录成功");
  15. }
  16. }
  17. </script>

这样如果没有填写就会弹出了没有弹出信息的提醒了

点击查看原图

MUI框架之输入框Input的更多相关文章

  1. 移动端 mui框架中input输入框或任何输入框聚焦后页面自动上移

    一.mui框架中点击input后,安卓手机弹出自带的输入键盘时,页面自动上移 实现方法: (1)只要把input标签放在mui-content这个类里面就可以了 <div class=" ...

  2. 使用mui框架开发App,当input获取焦点时,键盘弹出,底部导航栏上升。

    转自 https://blog.csdn.net/elementFei/article/details/72917393 感谢 问题: 使用mui框架开发App,当input获取焦点时,键盘弹出,底部 ...

  3. 【MUI框架】学习笔记整理 Day 2

    参考整理自MUI官网 http://dev.dcloud.net.cn/mui/ui/ (1)numbox(数字输入框) mui提供了数字输入框控件,可直接输入数字,也可以点击“+”.“-”按钮变换当 ...

  4. MUI 框架微信支付

    在MUI 框架中实现了支付宝支付后,以为MUI微信支付,也没什么大问题,结果这个问题困扰了我几天,后面再同事的提醒下终于弄出来了, 问题出在,开始使用Dcloud 公有证书 怎么也付不了....,后面 ...

  5. 【MUI框架】学习笔记整理 Day 1

    MUI 框架之 [原生UI] (1)accordion(折叠面板) 由二级列表演化而来 <ul class="mui-table-view"> 2 <li cla ...

  6. MUI框架-13-使用百度地图 API(图文教程)

    MUI框架-13-使用百度地图 API(图文教程) 后面有实例,转载请注明出处 一.申请百度地图权限 1.打开 百度地图开放平台:http://lbsyun.baidu.com/apiconsole/ ...

  7. mui框架中底部导航的跳转1

    mui框架极大的方便了app的开发但是我们在做页面之间的切换时发现不能实现 a 链接的跳转,这是应为mui相关的一些控件是通过拦截a标签上的href来实现的,所以mui.js会阻止a标签上的href跳 ...

  8. 制作输入框(Input)

    怎样判断是否应当使用输入框 输入框,就是用户可以自由输入文本的地方.当需要判断是否需要使用输入框时,可以遵循一条原则:凡是需要用户自主输入文本的地方,几乎都必须使用输入框. 输入框的常见用法:输入登录 ...

  9. 输入框 input只能输入正数和小数点

    输入框 input只能输入正数和小数点  限制文本框只能输入正数,负数,小数 onkeyup="value=value.replace(/[^\-?\d.]/g,'')" 限制文本 ...

随机推荐

  1. 华中邀请赛现场赛F题 Seats

    题目链接:http://acm.whu.edu.cn/land/problem/detail?problem_id=1552 解题报告:题目意思应该很清楚,就是有n个人,分别属于7个班级,然后他们坐成 ...

  2. 【Python】HackBack(获取暴力破解服务器密码的IP来源)

    1.前言 又在0x00sec上翻到好东东. https://0x00sec.org/t/python-hackback-updated/882 帖子里的脚本会得到那些暴力服务器密码失败的IP和用户名, ...

  3. .NET C# Tostring format 格式化字符串

    一.数值型 formatCode 是可选的格式化代码字符串.必须用“{”和“}”将格式与其他字符分开.如果恰好在格式中也要使用大括号,可以用连续的两个大括号表示一个大括号,即: “{{”或者“}}”. ...

  4. 【转】深入理解C++中public、protected及private用法

    首先明白以下两点: 1.类的一个特征就是封装,public和private作用就是实现这一目的. 即:用户代码(类外)可以访问public成员而不能访问private成员:private成员只能由类成 ...

  5. stdole.dll

    迁移至win1064位后,发布提示stdole.dll错误,查找半天,是因为引用了office组件问题,将其注释掉.解决.因为此块代码无用,但是对有用的代码如何解决发布问题,未找到合适解决方法.

  6. centos:SSH登录时间很慢

      vi /etc/ssh/sshd_config   GSSAPIAuthentication 改为 no 开启UseDNS,值改为 no   service sshd restart

  7. ASP.NET Web配置使用HTTPS实用案例

    Step by Step 配置使用HTTPS的ASP.NET Web应用 有关HTTPS.SSL以及SSL证书的工作原理,参见 <HTTPS那些事(一)HTTPS原理> <HTTPS ...

  8. Android应用--QR的生成(二维码)

    二维码的定义: 二维码(2-dimensional bar code),是用某种特定的几何图形按一定规律在平面(二维方向上)分布的黑白相间的图形记录数据符号信息的. 在许多种类的二维条码中,常用的码制 ...

  9. printf 字符串格式

    摘自:http://www.cppblog.com/API/archive/2013/07/18/201923.html 首先 long long是C99标准新规定的.不少编译器还不支持,Micros ...

  10. python强大的数据类型转换

    # 原始的二维表数据集 jsonObj=[] # 添加模拟的数据 for i in range(1001,1004): for j in range(1,34): jsonObj.append({&q ...