使用正则表达式根据字符和空格自动 enable/disable 按钮

Question

我一直在尝试创建一个提交按钮，当用户在输入框中输入内容时，该按钮会自动 enables/disables。我已经成功地创建了一个提交按钮，该按钮开始时处于禁用状态，然后在用户开始输入时启用，但我希望该按钮在用户输入数字或除字符或字符串以外的任何其他内容时禁用。

这是我目前的脚本代码：

$(document).ready(function() {
$('#seed').on('keyup', function(){
    var regEx = /^[a-zA-Z\s]*$/;

    if($(this).val() != regEx) {
        $('#submit').prop('disabled', false);
    } else {
        $('#submit').prop('disabled', true);
    }
}); 
});

连同我的主索引文件和我的表格：

<head>
    <title>Story Ideas</title>
    <link type="text/css" rel="stylesheet" href="style.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script defer src="js/script.js"></script>
</head>
    <div class="form-style">
    <form class="form" name="form" method="post" action="?v=ture">
        <label for="table">Select Your Story</label> <br />
        <select name="table" id="table">
            <option value="moons">Moons</option>
            <option value="lionbird">Lionbird</option>
            <option value="chik">Chik</option>
        </select>
        <br>
        <input type="text" id="seed" name="seed">
        <br>
        <input id="submit" type="submit" disabled="disabled">
    </form>
    </div>

    <?php
        include_once('includes/functions.php');
        if (isset($_GET['v']) && $_GET['v'] == true)
        {
            $t = $_POST['seed'];
            $table = $_POST['table'];
            echo genPoem($t, $table);
            echo "<br>";
            echo "<br>";
        }
    ?>
</body>

我尝试使用 var regEx = /^[a-zA-Z\s]*$/;以防止这种情况。我错过了什么吗？

Answer 1

您可以尝试 $(this).val().match(regEx) 而不是使用 !=，如 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions 中所述。

Answer 2

您没有使用正确的条件来检查您的值是否与正则表达式匹配，您的正则表达式没问题，只需将 if($(this).val() != regEx) 切换为 if(regEx.test($(this).val()))。

test方法参考： https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test

使用正则表达式根据字符和空格自动 enable/disable 按钮

Using regEx to auto enable/disable button depending on characters and spaces

html

javascript

forms

jquery

button