Сохраняйте обязательные теги во входах при использовании onclick ()

Question

Сохраняйте обязательные теги во входах при использовании onclick ()

0

Я использую входы с требуемым тегом, и на данный момент он не работает, и submit можно легко сделать даже без слова внутри входных данных. Я искал abit по этой причине, и я предполагаю, что это происходит, потому что я использую функцию onclick.

<form id="regform" method="POST">
First name: <input type="text" id="firstname" required  ><br>
Last name: <input type="text" id="lastname" required ><br>
Username: <input type="text" id="username" required><br>
Password: <input type="password" id="password" required><br>
<input type="radio" name="sex" value="male" required>Male<br>
<input type="radio" name="sex" value="female" >Female
<input type="submit" value="Register" onclick="regBtn(event)">
</form>

Есть ли способ сохранить требуемый актив при использовании onclick?

Juvi 02 дек. 2013, в 17:51

Источник

Теги:

javascript

html

3 ответа

0

Помните: требуемый атрибут входного тега не поддерживается в Internet Explorer 9 и более ранних версиях или в Safari.

Более безопасно это делать следующим образом:

<form id="regform" method="POST">
First name: <input type="text" id="firstname" class="required"><br>
Last name: <input type="text" id="lastname" class="required" ><br>
Username: <input type="text" id="username" class="required"><br>
Password: <input type="password" id="password" class="required"><br>
<input type="radio" name="sex" value="male" class="required">Male<br>
<input type="radio" name="sex" value="female" >Female
<input id="submit" type="submit" value="Register" onclick="regBtn(event)">
</form>

И код jQuery:

 $(".required").each(function() 
    {
      if ($(this).val() == "") 
        {
            $('#submit').prop('disabled','disabled');   
        }
    });

Aditzu 02 дек. 2013, в 14:39

0

Добавьте несколько строк в функцию regBtn.

function regBtn(event) {
    if (!Array.prototype.slice.call(document.querySelectorAll('input[required]:not([required=false])')).every(function (element) {
        return element.value != '';
    })) {
        return false;
    }
    //main function
}

Tom Chung 02 дек. 2013, в 13:46

Ещё вопросы

Shadow Wizard · Accepted Answer · 2013-12-02T14-41-00.000Z

Да. Прямо сейчас у вас есть такая строка где-то:

document.getElementById("regform").submit();

Которые игнорируют любые встроенные проверки и просто представляют форму.

Вместо этого переместите вызов функции в форму onsubmit следующим образом:

<form id="regform" method="POST" onsubmit="return regBtn(event);">

И измените функцию, чтобы вернуть true или false вместо принудительной отправки:

function regBtn(event) {
    if (some_cond_here) {
        //all is good, let submit the form!
        return true;
    } else {
        //something is off, cancel form submission:
        return false;
    }
}

Это сохранит встроенную проверку формы HTML5.

Живой тестовый пример - имеет имя пользователя с одной или двумя буквами, чтобы увидеть, как ручная проверка выполняется.