jQuery event.preventDefault путаница

Question

Я использую jQuery.

При нажатии кнопки поиска используется флаг, чтобы проверить, не выключена ли радиопереключатель, он покажет alert("enter the field"), в противном случае выполните задачу ... а также я использовал event.preventDefault();

Здесь на самом деле я использую радиокнопку, в которой я использовал гендерную метку, которая содержит два варианта мужской и женский. Теперь проблема в том, когда я проверил мужской переключатель или женский. Тем не менее это показывает, введите поле. Я думаю, что в этой части должно быть что-то не так if($('#gender').is(":not(:checked)"))

вот мой код:

$('#searchbutton').click(function(event){

    alert("ZZ");

    var flag3=0;
    if ($('#gender').is(":not(:checked)"))
    {
        flag3=1;
    }
    if( flag3==1)
       alert("Select the field first");
    event.preventDefault();

});

<input type="radio" name="gender" id="gender" value="male" /> Male<br />
<input type="radio" name="gender" id="gender" value="female" /> Female
<input type="submit"  name="searchbutton" value="Search" id="searchbutton">

Answer 1

В вашем коде несколько проблем.

• Идентификатор можно использовать только один раз в HTML-документе.Вы использовали #gender дважды.
• Вам не нужно использовать другую переменную-флаг, вы можете просто запустить if.
• Во второй if вы не использовали {} скобки, поэтому preventDefault всегда выполняется.

Я предлагаю вам сделать что-то вроде этого:

<input type="radio" name="gender" value="male" /> Male<br />
<input type="radio" name="gender" value="female" /> Female
<input type="submit"  name="searchbutton" value="Search" id="searchbutton">

и jQuery:

$('#searchbutton').click(function(event){
    if ($('input[name="gender"]:checked').length < 1) {
       alert("Select the field first");
       event.preventDefault();
    }
});

Рабочая демонстрация

Объяснение : Селектор атрибута будет соответствовать input s, у которых name равно gender, а :checked селектор выбирает только те, которые проверены.Затем, используя length, мы можем увидеть, сколько элементов было найдено.Если ноль, это означает, что использование не выбрало ни одного из параметров.

Answer 2

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

Непосредственная проблема заключается в том, что оба <input type="radio"> имеют одинаковый идентификатор.Хотя правильно присвоить им одно и то же имя, вы никогда не назначаете двум элементам один и тот же идентификатор .

Кроме того, вам просто нужно проверить, установлены ли какие-либо переключатели.Вот как бы я написал следующий код:

$('#searchbutton').click(function (e) {
    if ($(':radio:checked[name="gender"]').length == 0) {
        alert("Select the field first");
        e.preventDefault();
    }
});