zoukankan      html  css  js  c++  java
  • input框的内容变化监听

    input的两个功能

    1.不允许一开始输入空格(即在input框内容为空的时候,输入空格是没有作用的)

    2.input框的内容变化监听

    这属于比较完美的input的设计了

    下面是html代码实现功能1

    <input name="assword" type="text" class="search_input" size="28" placeholder="请输入关键字"  value="" onKeypress="javascript:if(event.keyCode == 32 && this.value =='')event.returnValue = false;" required oninvalid="setCustomValidity('请输入关键字搜索')"  oninput="setCustomValidity('')>

    这里的oninput="setCustomValidity('')很多网站的所谓改变required的提示信息都会漏掉这个,会造成一个相当隐形的bug,就是在第一次提示之后,input输入内容会不断的提示required信息以及有内容的情况下提交表单也会这样提示。

    下面是JS的代码,这里引用了JQ

    /*input键盘事件显示打叉*/
    $('.search_input').bind("input propertychange", function(){  
           if($('.search_input').val()==''){
            $('.icon-search_input').css('display','none');
           }else{
            $('.icon-search_input').css('display','block');
           }
    });


  • 相关阅读:
    Mysql数据库再度使用
    搭建wamp php环境
    phpMyAdmin
    windows激活全系列
    web常见之音乐播放器
    web常见效果之轮播图
    ASP.NET Web Pages
    Eclipse配置中文(汉化)
    以有涯随无涯
    How to get the edited text from itext in fabricjs
  • 原文地址:https://www.cnblogs.com/hoewang/p/10257251.html
Copyright © 2011-2022 走看看