Проверьте содержимое поля ввода с помощью jquery

Я новичок в javascript, и у меня есть форма, когда я пытаюсь получить информацию о пользователе, она работает неправильно.Проверьте содержимое поля ввода с помощью jquery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body> 
 
    <form method="post" action=""> 
 
     <div class="form-row"> 
 
      <label> 
 
       <span>Register</span> 
 
       <select name="register_as" id="dropdown"> 
 
        <option value="none">Select One</option> 
 
        <option value="user">User</option> 
 
        <option value="designer">Designer</option> 
 
       </select> 
 
      </label> 
 
     </div> 
 
     <div> 
 
      <label><span>Gender</span></label> 
 
      <div class="form-radio-buttons"> 
 

 
       <div> 
 
        <label> 
 
         <input type="radio" name="gender" value="male"> 
 
         <span>Male</span> 
 
        </label> 
 
       </div> 
 

 
       <div> 
 
        <label> 
 
         <input type="radio" name="gender" value="female"> 
 
         <span>Female</span> 
 
        </label> 
 
       </div> 
 

 
      </div> 
 
     </div> 
 
     <div> 
 
      <input type="submit"> 
 
     </div> 
 
    </form> 
 
</body> 
 
</html> 
 

 
<script> 
 
    $(document).ready(function() { 
 

 
     $("form").submit(function (e) { 
 

 
      //Check if gender has not been selected 
 
      var gender = $(this).find('input[name="gender"]').val(); 
 
      if(!gender){ 
 
       alert('select a gender'); 
 
      } 
 

 
      //Check if 'register_as' is equal to 'user' or designer 
 
      var register_as = $("#dropdown").val(); 
 
      if(register_as!= 'user' | register_as!= 'designer'){ 
 
       alert('Register as user or designer'); 
 
      } 
 

 
      e.preventDefault(); 
 
     }); 
 
    }); 
 
</script>

Когда пользователь хочет зарегистрироваться, он должен выбрать между user и designer. Если то, что он выбирает, другое, мы предупреждаем его. То же, что и пол, он должен выбирать между male и female.

Просьба помочь мне решить эту проблему.

источник

2016-07-11 Prince

'это не работает правильно' - так в чем же ваша ошибка? – Huelfe

Чтобы получить значение радиогруппы, вам необходимо использовать :checked или вы получите первое за все время.

var gender = $(this).find('input[name="gender"]:checked').val();

Логический оператор Javascript &&

$(document).ready(function() { 
 

 
     $("form").submit(function (e) { 
 

 
      //Check if gender has not been selected 
 
      var gender = $(this).find('input[name="gender"]:checked').val(); 
 
      if(!gender){ 
 
       alert('select a gender'); 
 
      } 
 

 
      //Check if 'register_as' is equal to 'user' or designer 
 
      var register_as = $("#dropdown").val(); 
 
      if(register_as!= 'user' && register_as!= 'designer'){ 
 
       alert('Register as user or designer'); 
 
      } 
 

 
      e.preventDefault(); 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    
 
    <form method="post" action=""> 
 
     <div class="form-row"> 
 
      <label> 
 
       <span>Register</span> 
 
       <select name="register_as" id="dropdown"> 
 
        <option value="none">Select One</option> 
 
        <option value="user">User</option> 
 
        <option value="designer">Designer</option> 
 
       </select> 
 
      </label> 
 
     </div> 
 
     <div> 
 
      <label><span>Gender</span></label> 
 
      <div class="form-radio-buttons"> 
 

 
       <div> 
 
        <label> 
 
         <input type="radio" name="gender" value="male"> 
 
         <span>Male</span> 
 
        </label> 
 
       </div> 
 

 
       <div> 
 
        <label> 
 
         <input type="radio" name="gender" value="female"> 
 
         <span>Female</span> 
 
        </label> 
 
       </div> 
 

 
      </div> 
 
     </div> 
 
     <div> 
 
      <input type="submit"> 
 
     </div> 
 
    </form>

источник

2016-07-11 14:03:52 Kld

Добавлена .filter(':checked') в гендерной проверки и изменены | к && в если условие выпадающий список проверки

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body> 
 
    <form method="post" action=""> 
 
     <div class="form-row"> 
 
      <label> 
 
       <span>Register</span> 
 
       <select name="register_as" id="dropdown"> 
 
        <option value="none">Select One</option> 
 
        <option value="user">User</option> 
 
        <option value="designer">Designer</option> 
 
       </select> 
 
      </label> 
 
     </div> 
 
     <div> 
 
      <label><span>Gender</span></label> 
 
      <div class="form-radio-buttons"> 
 

 
       <div> 
 
        <label> 
 
         <input type="radio" name="gender" value="male"> 
 
         <span>Male</span> 
 
        </label> 
 
       </div> 
 

 
       <div> 
 
        <label> 
 
         <input type="radio" name="gender" value="female"> 
 
         <span>Female</span> 
 
        </label> 
 
       </div> 
 

 
      </div> 
 
     </div> 
 
     <div> 
 
      <input type="submit"> 
 
     </div> 
 
    </form> 
 
</body> 
 
</html> 
 

 
<script> 
 
    $(document).ready(function() { 
 

 
     $("form").submit(function (e) { 
 

 
      //Check if gender has not been selected 
 
      var gender = $(this).find('input[name="gender"]').filter(':checked').val(); 
 
      if(!gender){ 
 
       alert('select a gender'); 
 
      } 
 

 
      //Check if 'register_as' is equal to 'user' or designer 
 
      var register_as = $("#dropdown").val(); 
 
      if(register_as!= 'user' && register_as!= 'designer'){ 
 
       alert('Register as user or designer'); 
 
      } 
 

 
      e.preventDefault(); 
 
     }); 
 
    }); 
 
</script>

источник

2016-07-11 14:04:12 kapantzak

Проверьте содержимое поля ввода с помощью jquery

ответ

Смежные вопросы