отключить все другие входы, если команда/конкретный ввод не заполнен

Я пытаюсь отключить все другие входы в определенной форме <form id="join">, если пользователь сначала не заполнил ввод <input type="text" id="userkey" name="userkey" />, и все остальные входы останутся отключенными до тех пор, пока не будет заполнен ввод <form id="join">.

Причина этого в том, чтобы моделировать поведение пользователей, чтобы они первыми присоединились к нашему раздору на сайте по разным причинам, в которые я не буду вдаваться. Я понимаю, что это не безопасный метод. Все пользовательские данные будут очищены и проверены на стороне сервера для защиты сайта/базы данных. Я понимаю, что это можно обойти и по-прежнему отправлять данные, опять же, пользовательские данные будут очищены и проверены на стороне сервера для защиты сайта/базы данных. Я делаю это, потому что даже с огромным примечанием в форме членства они все равно пытаются отправить данные и обойти присоединение к разногласиям, что затрудняет общение с ними. это попытка защитить сайт от идиотов, а также он блокирует большое количество спама, поскольку спам-боты обычно не могут присоединиться к разногласиям.

вот очень простой пример, который я экстраполирую на нашу реальную форму членства.

вот хтмт

<form id="join-membership">
    user key
    <br />
    <input type="text" id="userkey" name="userkey" />
    <br />
    <p>If you do not have a user key, please <a href="#">join our discord</a> to get one</p>
    Email
    <br />
    <input type="email" id="email" disabled="disabled" />
    <br />
    Username
    <br />
    <input type="text" id="username" name="username" disabled="disabled" />
    <br />
    Password
    <br />
    <input type="password" id="pass" name="password" disabled="disabled" />
    <br />
    Confirm Password
    <br />
    <input type="password" id="pass2" name="password2" disabled="disabled" />
    <br />
    About You
    <br />
    <textarea id="about" name="about" disabled="disabled"></textarea>
    <br />
    <input type="submit" id="submit" value="Register" disabled="disabled" />
</form>
<div id="test"></div>

    

вот JavaScript

<script>

(function() {
    $('form > input').keyup(function() {

        var email = true;
        var empty = false;
        $('form > input').each(function() {
            if ($(this).val() == '') {
                empty = true;
            }
        });

        if (email == empty) {
            $('#register').attr('disabled', 'disabled');
        } else {
            $('#register').removeAttr('disabled');
        }
    });
})()

</script>

Обратите внимание, что я супер новичок в JavaScript и в Интернете, исследовал и нашел скрипт для отключения кнопки отправки, но наша форма немного сложна, и я не хочу, чтобы пользователи пытались заполнить ее, чтобы узнать, может ли не отправляйте его, даже если они не прочитали инструкцию. Это модель поведения пользователя, которая, как я надеюсь, обеспечит лучший пользовательский опыт в долгосрочной перспективе.

Спасибо за любую оказанную помощь.


person Monkeework    schedule 29.10.2020    source источник


Ответы (1)


Привет, ты можешь попробовать что-то вроде этого

 (function() {
    $("#userkey").keyup(function() {
      const userkey = this.value;
        if (userkey) {
          $('.other-inputs input, .other-inputs textarea').removeAttr('disabled');
            } else {
             $('.other-inputs input, .other-inputs textarea').attr('disabled', 'disabled');
         }
    });
})()

при изменении ввода ключа пользователя функция проверяет, есть ли значение во входе userkey, если оно существует. Он удалит атрибут disabled из входов, которые находятся в div other-input

Посмотрите здесь для примера: https://jsfiddle.net/t4ub0xs3/

person Edin Puzic    schedule 29.10.2020
comment
вместо foreach вы можете один раз проверить ключ пользователя и выполнить действие над набором элементов $('.other-inputs input, .other-inputs textarea').removeattr('disable') или $('.other-inputs input, .other-inputs textarea').attr('отключено', 'отключено'); - person Lety; 29.10.2020
comment
@Lety исправил спасибо за предложение - person Edin Puzic; 29.10.2020
comment
Спасибо всем, я самый счастливый 12-летний ребенок на свете! - person Monkeework; 29.10.2020