zoukankan      html  css  js  c++  java
  • input 禁止输入特殊字符

    方式一:拿到value值以后 在你传递之前处理

    function stripscript(value) {
    var pattern = new RegExp("[`~!@#$^&*()=|{}':;',\[\].<>/?~!@#¥……&*()——|{}【】‘;:”“'。,、?]")
    var rs = "";
    for (var i = 0; i < value.length; i++) {
    rs = rs+s.substr(i, 1).replace(pattern, '');
    }
    return rs;
    }

    直接调用这个函数即可 。

    方式二:从最根本上也就是提示用户输入不了特殊字符

    function showKeyPress(evt) {
    evt = (evt) ? evt : window.event
    return checkSpecificKey(evt.keyCode);
    }

    function checkSpecificKey(keyCode) {
    var specialKey = "[`~!#$^&*()=|{}':;',\[\].<>/?~!#¥……&*()——|{}【】‘;:”“'。,、?]‘’";//Specific Key list
    var realkey = String.fromCharCode(keyCode);
    var flg = false;
    flg = (specialKey.indexOf(realkey) >= 0);
    if (flg) {
    // alert('请勿输入特殊字符: ' + realkey);
    return false;
    }
    return true;
    }
    document.onkeypress = showKeyPress;

    使用:在input控件上加入事件  οnkeypress="showKeyPress()",他会输入的时候 根本没反应

    这个好像有点小问题 中文状态下没反应 不知道怎么回事  所以又找了一种

    方式三:onkeyup事件 拿到以后去匹配 跟方式一类似

    function ValidateValue(textbox) {
    var IllegalString = "[`~!#$^&*()=|{}':;',\[\].<>/?~!#¥……&*()——|{}【】‘;:”“'。,、?]‘’";
    var textboxvalue = textbox.value;
    var index = textboxvalue.length - 1;

    var s = textbox.value.charAt(index);

    if (IllegalString.indexOf(s) >= 0) {
    s = textboxvalue.substring(0, index);
    textbox.value = s;
    }

    }

    使用: onkeyup = "ValidateValue(this)" 他会输入以后会立马消失,用户是可以看得到我输入的 只是说输入以后就没了,弊端是连续输入就不会消失了(按住不动)

    接下来最牛逼的一种 中和以上方式

    方式四:直接在控件上使用正在

    // <input οnkeyup="value=value.replace(/[W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))">
    // 控制输入框只能输入文字或数字,也可以不允许输入特殊字符 这里不允许输入如下字符: (像 !@#$%^&* 等)<br>

    这种方式用户可以看到输入了会立马消失 跟方式三差不多 但连续输入是有效的

  • 相关阅读:
    Docker界面化管理
    搭建MQTT服务器(Docker版)
    VS Code Markdown文件实时预览
    Nginx直接处理接口请求,返回相应内容(带html标签)
    Docker(九): 安装MySQL主从复制
    feign的一个注解居然隐藏这么多知识!
    使用Magisk指令修改 ro.debuggable(不刷机)
    【钓鱼可用】文件名反转字符串
    android高级UI之贝塞尔曲线<下>--贝塞尔曲线运用:QQ消息气泡
    英文阅读技巧操练---Article 1:The Product-Minded Software Engineer《一》
  • 原文地址:https://www.cnblogs.com/JurasVon/p/11684087.html
Copyright © 2011-2022 走看看