SemanticUI框架下表单非空验证的简易方法

不知道在其他UI框架或者不用UI框架下是否生效,由于这个非空验证生成信息的div使用的是SemanticUI框架的语法,所以暂时不确定,待以后验证…
先引入jquery.js文件
然后看如下:

<script>
// 表单非空验证
  $('.ui.form').form({
    fields : {
      username : {
        identifier: 'username',
        rules: [{
          type : 'empty',
          prompt: '请输入用户名'
        }]
      },
      password : {
        identifier: 'password',
        rules: [{
          type : 'empty',
          prompt: '请输入密码'
        }]
      }
    }
  });
  
  
  
</script>

比如在登录界面做表单验证,那么在登录按钮下加一个div(这个div还是处在同一个form中),格式如下:

<div class="ui error mini message"></div>

然后非空验证的效果如图:
在这里插入图片描述看下界面代码:
在这里插入图片描述之前声明的<div class="ui error mini message"></div>里面已经填充了一个ul无序列表。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值