【问题标题】:Restrict input totally on an input field将输入完全限制在输入字段上
【发布时间】:2015-03-25 19:28:34
【问题描述】:

可以对表单字段施加限制以停止输入数字、字符或符号,但出于兴趣,是否有一种方法可以完全限制任何类型的输入。例如。

Javascript

    var digitsOnly = /[1234567890]/g;
    var integerOnly = /[0-9\.]/g;
    var alphaOnly = /[A-Za-z]/g;

    function restrictCharacters(myfield, e, restrictionType) {
        if (!e) var e = window.event
        if (e.keyCode) code = e.keyCode;
        else if (e.which) code = e.which;
        var character = String.fromCharCode(code);
        if (code==27) { this.blur(); return false; }
        if (!e.ctrlKey && code!=9 && code!=8 && code!=36 && code!=37 && code!=38 && (code!=39 || (code==39 && character=="'")) && code!=40) {
            if (character.match(restrictionType)) {
                return true;
            } else {
                return false;
            }

        }

HTML:

<form action="" method="get">
<p><label for="input1">digitsOnly: </label> <input type="text" id="input1" onkeypress="return restrictCharacters(this, event, digitsOnly);" /></p>

<p><label for="input2">integerOnly</label> <input type="text" id="input2" onkeypress="return restrictCharacters(this, event, integerOnly);" /></p>

<p><label for="input3">alphaOnly</label> <input type="text" id="input3" onkeypress="return restrictCharacters(this, event, alphaOnly);" /></p>

为了停止完全限制,我假设您会结合不同的正则表达式变量,但您将如何防止用户复制和粘贴或拖动内容到字段中以及防止按键操作?

【问题讨论】:

    标签: javascript jquery regex forms input


    【解决方案1】:

    你可以给它“只读”属性:

    <input type=text readonly=readonly ...>
    

    “readonly”属性不同于“disabled”属性;表单字段可以是“只读的”,但仍会随表单一起发布或由 jQuery 序列化。 “disabled”属性,如果存在的话,一旦表单发布到服务器,就好像该字段不存在。

    您可以使用 CSS 设置只读字段的样式:

    input[readonly] { border-width: 0px; border-style: none; }
    

    (或其他)。您也可以从 JavaScript 设置属性:

    document.getElementById("someInput").readOnly = true;
    

    【讨论】:

    • 这比用JS方便多了,不知道有没有
    【解决方案2】:

    您也可以完全禁用它:

    <input type="text" disabled=true >
    

    【讨论】:

    • 是的,但是它不会与表单一起发布。当然,这可能没问题。
    • 我真正喜欢的关于禁用输入的主要内容是浏览器清楚地显示您无法编辑它(如果您单击文本,它会变灰并且不显示插入符号)。为了绕过不与表单一起发布的元素,我通常会添加一个具有相同值和正确名称的隐藏元素。
    最近更新 更多