inArray не возвращает true, когда значение соответствует объекту массива

Question

Я хочу проверить, существует ли вход в массиве, и я продолжаю получать вывод, показывающий значение false, даже когда вход определенно соответствует объекту в массиве. Я что-то упустил?

var name = $(".name").val();
var nameArray = ["Mary", "John"]

$(".submit").on('click', function(e) {
  e.preventDefault();

  function nameExists(name) {
    if ($.inArray(name, nameArray) >= 0) {
      return true;
    }
    return false;
  }

  console.log(nameExists());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input class="name">
  <input type="submit" class="submit">
</form>

Answer 1

Две проблемы:

1. Вы устанавливаете name при первой загрузке страницы, а не когда пользователь отправляет форму.
2. Вы не передаете name переменная для функции при вызове.

var nameArray = ["Mary", "John"]

$(".submit").on('click', function(e) {
  e.preventDefault();

  function nameExists(name) {
    if ($.inArray(name, nameArray) >= 0) {
      return true;
    }
    return false;
  }
  var name = $(".name").val();
  console.log(nameExists(name));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input class="name">
  <input type="submit" class="submit">
</form>