zoukankan      html  css  js  c++  java
  • easyui-tooltip的使用

    通常情况下,在提交form表单时,需要验证一些基本信息,下面是一个平时遇到的小例子:

    <div class="form-group">
        <label for="title" class="col-sm-3 control-label">姓名</label>
        <div class="col-sm-7">
            <input type="text" class="form-control easyui-tooltip" id="name" name="name" placeholder="请输入姓名" data-options="position: 'top',onShow:inputTipOnShow">
        </div>
        <span class="redtip">*</span>
    </div>

    function inputTipOnShow(){    
      $(this).tooltip('tip').css({
        backgroundColor: '#666',
        borderColor: '#666'
      });
    }

    $(document).ready(function() {
      //通过tooltipshowEventhideEvent来控制tooltip显示,以下设置方式表示tooltip只有主动show的时候才会显示,当键盘有输入就会隐藏,避免鼠标一移到输入框tooltip就显示
      $("#name").tooltip({
        showEvent: null,
           hideEvent: "keydown"
      });
      //如果form表单在一个弹出的window中,在关闭window时,要将tooltip隐藏,否则如果关闭window之前有tootip信息显示,那么该tooltip会一直显示,直到页面刷新
      $('#window').window({
        onBeforeClose:function(){
          $("#name").tooltip('hide');
        }
      });
    });
    //在提交时判断是否为空,如果为空就要tootip提示
    if($("#name").val().length == 0){
        $("#name").tooltip({
            content:"姓名不能为空!"
        });
        $("#name").tooltip("show");
        $("#name").focus();
        return false;
    }
    顺带提一句,如果输入的是年龄,要控制年龄的合法性,首先要用正则表达式判断是否为正整数,然后再看是否在某个范围内,在js中比较大小要用parseInt()不能直接比较,例如if(parseInt(s1)>parseInt(s2)){}
  • 相关阅读:
    JVM发生OOM调优
    行云创新完成B轮融资,阿里云独家投资
    行云创新直播回顾:DDD“爱”上Dapr
    如何通过Dapr快速实现DDD?
    通过Dapr快速落地DDD,实现高并发
    上K8s,研发团队如何从容一点?
    直播来了!等你围观!聊聊服务网格那些事儿
    服务网格出现流量故障该咋办?SolarMesh发布重大功能
    mysql 授权问题
    Centos Mysql5.7 安装
  • 原文地址:https://www.cnblogs.com/llfddmm/p/7883162.html
Copyright © 2011-2022 走看看